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

Button styles can be applied to anything with the .btn class applied. However, typically you'll want to apply these to only a and button elements for the best rendering.

btnStandard gray button with gradient
btn-defaultDefault button with gradient
btn btn-primaryProvides extra visual weight and identifies the primary action in a set of buttons
btn btn-infoUsed as an alternative to the default styles
btn btn-successIndicates a successful or positive action
btn btn-warningIndicates caution should be taken with this action
btn btn-dangerIndicates a dangerous or potentially negative action
btn btn-inverseAlternate dark gray button, not tied to a semantic action or use

Outline button no-border-radius

Outline button no-border

Circle button btn-circle

Fancy larger or smaller buttons? Add .btn-large, .btn-small, or .btn-mini for additional sizes.

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

Button dropdowns work at any size: .btn-large, .btn-small, or .btn-mini.

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



Background Image