Buttons

Use a variant class to communicate an action's emphasis. Buttons support small, large, block, icon, focus, and disabled states.

Buttons Modifiers

• Primary action.

  .btn--primary

• Secondary action.

  .btn--secondary

• Outlined primary action.

  .btn--outline-primary

• Outlined secondary action.

  .btn--outline-secondary

• Primary action with an elevated shadow.

  .btn--primary-shadow

• A compact button.

  .btn--sm

• A large button.

  .btn--lg

• A full-width button.

  .btn--block

• Square padding for an icon-only button; provide an accessible name.

  .btn--icon