Buttons
Choose your Style
You can set different colors by adding btn-primary
class for example. Want embossed button? Add btn-embossed
class, that's it!
Classic Style
Default style with btn
class.
Embossed style
How to use? Just add btn-embossed
class.
Rounded style
How to use? Just add btn-rounded
class.
Transparent style
How to use? Just add btn-transparent
class.
Square style
How to use? Just add btn-square
class.
Mixed style
Make your style unique by mixing it! For example btn-primary btn-square btn-embossed
class.
Group Buttons
Group buttons are great if you want to display a group of actions. To do that, just put you buttons inside a btn-group
class div.
Horizontal group
Vertical group
Nested button groups
Icons Buttons
You can add icons on the left or right side of button with color you want. Perfect for action buttons and social connection.
Icons styled button
Icons rounded button
Icons styled button
Block Social Buttons
Loading State & Size Buttons
Loading button Click to see loading state
Loading state are perfect for login, register or form submission.
Size Buttons for small to Huge effect
You can choose your size by simply adding a class like btn-sm
for small button.
Dropdown Buttons
Use any button to trigger a dropdown menu by placing it within a .btn-group
and providing the proper menu markup.