Buttons

Bootstrap 5 based Coats Digital Design Language's custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.

Basic example

Bootstrap 5 based design language includes several predefined button styles, each serving its own semantic purpose, with a few extras thrown in for more control.

Outline buttons

In need of a button, but not the hefty background colors they bring? Replace the default modifier classes with the .cd-btn-outline-* ones to remove all background images and colors on any button.

Some of the button styles use a relatively light foreground color, and should only be used on a dark background in order to have sufficient contrast.

Rounded buttons

Add .cd-btn-rounded class to make the button rounded.

Rounded outline butons

You can use .cd-btn-outline-* and .cd-btn-rounded together to make the button outline and rounded at the same time.

Floating buttons

Use .cd-btn-floating class to make a circle button.