Buttons
Button with icon
Basic buttons are traditional buttons with borders color opitons.
Button with loading animation
Basic buttons are traditional buttons with borders color opitons.
Button size
Add .btn-lgor .btn-smor .d-lgfor additional sizes.
Button Width
Use .btn-w-xs,.btn-w-sm,.d-w-md,.d-w-lgto get buttons from small to large widths.
Button Block
Use .btn-blockfor block size button.
Checkbox Button Group
Radio Button Group
Buttons Group
Social buttons
You can use only icons.
Icon buttons
Icon only button. Add .btn-iconclass to remove unnecessary button.
Loading button
Add .btn-loadingto use a loading state on a button. The width of the button depends on the length of the text inside Since the loading spinner is implemented using the element.
Add .btn-spinningto use a loading state on a button. The width of the button depends on the length of the text inside Since the loading spinner is implemented using the element.
Button dropdown
Wrap the dropdown’s toggle using different colors and icons implemented in different dropdowns styles(your button or link) and the dropdown menu within .dropdown,or another element that declares position:relative;. Dropdowns can be triggered from <a>or <button>elements to better fit your potential needs.
List of buttons
You can now create a list of buttons with the .btn-listcontainer.
Use the .text-centermodifiers to alter the alignment.
Use the .text-endmodifiers to alter the alignment.
