Buttons

Use Theme’s custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.

Subtle

Theme only

Creates a subtle variant of a corresponding contextual button variation. 

<button class="btn btn-primary-subtle">Primary subtle</button>
<button class="btn btn-secondary-subtle">Secondary subtle</button>
<button class="btn btn-success-subtle">Success subtle</button>
<button class="btn btn-danger-subtle">Danger subtle</button>
<button class="btn btn-warning-subtle">Warning subtle</button>
<button class="btn btn-info-subtle">Info subtle</button>

Pills

Theme only

Creates a rounded variation of a button component. 

<button class="btn btn-primary btn-pill btn-lg">
  Button pill
</button>

<button class="btn btn-success btn-pill">
  Button pill
</button>

<button class="btn btn-danger btn-pill btn-sm">
  Button pill
</button>

Circle

Theme only

Turn any button into a circle with a .btn-rounded-cirle modifier. 

<button class="btn btn-lg btn-rounded-circle btn-primary">
  <i class="fe fe-check"></i>
</button>

<button class="btn btn-rounded-circle btn-primary">
  <i class="fe fe-check"></i>
</button>

<button class="btn btn-sm btn-rounded-circle btn-primary">
  <i class="fe fe-check"></i>
</button>

<button class="btn btn-xs btn-rounded-circle btn-primary">
  <i class="fe fe-check"></i>
</button>
Jump to