Use any of the available button classes to quickly create a styled button.

Default Buttons

Colorful Buttons

Square Buttons

Do you like the square buttons? Add .btn-squared to it

Disabled State

Add the disabled attribute to <button> buttons.

Sizes

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

Button tags

Use the button classes on an <a> , <button> , or <input> element.

Go to link

Button groups

Wrap a series of buttons with .btn in .btn-group .

Examples to use buttons with font awesome icons.

Examples to use buttons with glyphicon halflings icons.

Buttons with both text and icon.

Delete Item Add Item Listen

Submit Entry pricing options

Navigation icons.

Toolbar icon example

A UI concept which merges loading indicators into the action that invoked them. Click the buttons to see the effect.

Built-in progress bar

Sizes

Turn checkboxes and radio buttons in toggle switches.

Create block level buttons—those that span the full width of a parent— by adding .btn-block .

Link

Link (big)

Dropdown buttons

Use any button to trigger a dropdown menu by placing it within a .btn-group and providing the proper menu markup.

Split button dropdowns

Similarly, create split button dropdowns with the same markup changes, only with a separate button.

Dropdown button with icons

Examples to use dropdown with font awesome icons.

Sizing

Button dropdowns work with buttons of all sizes.

Dropdown with checkboxes

NOTE:   By adding dropdown-enduring class you can avoid closing the dropdown on click

Dropup menu options

NOTE:   By adding dropup class you make dropup menu.