Buttons

Use Bootstrap’s custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more. Buttons can also be used with dropdowns. Please read the official Bootstrap documentation for a full list of options.

Do:

  • Be clear and accurate with labels or call to actions
  • Use strong, actionable verbs
  • Use established button colors
  • Keep most important actions first
  • Position in consistent locations on page
  • Use wide buttons for back, next, and submit buttons in dialogs

Don't:

  • Use unclear or misleading language for call to actions
  • Use too many call to actions creating confusion
  • Use wide buttons for cancel buttons in dialogs

Standard Buttons


Small Buttons


Dialog Buttons

Wider buttons for back, next, and submit actions within dialogs. Do not use wide styling for cancel actions.



Icon ButtonsAcquia Design System only

A combination of the standard button component and a feather icon.

Border

Enabled

Disabled

Borderless

Transparent