LOADING...

Buttons page header description goes here...


Classes

Bootstrap includes several predefined button styles, each serving its own semantic purpose, with a few extras thrown in for more control. Please read the official Bootstrap documentation for the full list of options.

INSTALLATION

Outline buttons

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

INSTALLATION

Sizes

Fancy larger or smaller buttons? Add .btn-lg or .btn-sm for additional sizes.

INSTALLATION
LARGE BUTTON
SMALL BUTTON

States

Buttons will appear pressed when active or you can still force the same active appearance by adding .active class. Make buttons look inactive by adding the disabled boolean attribute to any <button> element.

INSTALLATION
ACTIVE STATE
Primary link Link
DISABLED STATE

Button group

Group a series of buttons together on a single line with the button group, and super-power them with JavaScript.

INSTALLATION

Group size

Instead of applying button sizing classes to every button in a group, just add .btn-group-* to each .btn-group, including each one when nesting multiple groups.

INSTALLATION

Vertical Group

Make a set of buttons appear vertically stacked rather than horizontally. Split button dropdowns are not supported here.

INSTALLATION

Button toolbar

Combine sets of button groups into button toolbars for more complex components. Use utility classes as needed to space out groups, buttons, and more.

INSTALLATION
THEME COLOR
Choose your favorite theme color