logologo-dark

Buttons

Documentation and examples of button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.

Example with Variations

Bootstrap includes several predefined button styles, each serving its own semantic purpose, with a few extras thrown in for more control.

Code Example
<a href="#" class="btn btn-primary">Primary</a>
Code Example
<a href="#" class="btn btn-dim btn-primary">Primary</a>
Code Example
<a href="#" class="btn btn-outline-primary">Primary</a>
Code Example
<a href="#" class="btn btn-dim btn-outline-primary">Primary</a>
Code Example
<a href="#" class="btn btn-xl btn-primary">Button Large</a>
Code Example
<a href="#" class="btn btn-xl btn-primary">Button Large</a>
Code Example
<a href="#" class="btn btn-round btn-lg btn-primary">Button Large</a><a href="#" class="btn btn-round btn-primary">Button Regular</a><a href="#" class="btn btn-round btn-primary"><em class="icon ni ni-setting"></em><span>Button Regular</span> </a><a href="#" class="btn btn-round btn-primary"><span>Button Regular</span><em class="icon ni ni-chevron-down"></em></a><a href="#" class="btn btn-round btn-primary btn-action"><span>Button Regular</span><em class="icon ni ni-chevron-down"></em></a><a href="#" class="btn btn-round btn-sm btn-primary">Button Small</a>
Code Example
<a href="#" class="btn btn-primary"><em class="icon ni ni-setting"></em><span>Button Regular</span> </a><a href="#" class="btn btn-primary"><span>Button Regular</span><em class="icon ni ni-chevron-down"></em></a><a href="#" class="btn btn-primary btn-action"><span>Button Regular</span><em class="icon ni ni-chevron-down"></em></a>
  • lg
  • Rg
  • Sm
  • lg
  • Rg
  • Sm
Code Example
<a href="#" class="btn btn-icon btn-lg btn-primary"><em class="icon ni ni-play"></em></a>
Switch Demo Layout
Use Case Concept
Preview Settings
Direction Change
LTR Mode
RTL Mode
Main UI Style
Default
Shady
Sidebar Style
White
Light
Dark
Theme
Header Style
White
Light
Dark
Theme
Primary Skin
Default
Blue Light
Egyptian
Purple
Green
Red
Skin Mode
Light Skin
Dark Skin
Looking for functional script for Investment Platform? Check out
Investorm
Looking for Advanced
Investment Platform?