• Button
  • Default and primary button style. Should be used in most cases. button
  • Button secondary
  • Secondary button style. Used when there are multiple buttons and only one is the primary action. button button--secondary
  • Button tertiary
  • Tertiary button style. Also used when there are multiple buttons and only one is the primary action. button button--tertiary
  • Button outline
  • Outline button style. Provides an alternative style that is less prominent on the page. Useful when there are multiple buttons down a long page. button button--outline
  • Button secondary outline
  • Secondary and outline button style. Outline and secondary styles can be combined.  button button--outline button--secondary
  • Button tertiary outline
  • Tertiary and outline button style. Outline and tertiary styles can be combined.  button button--outline button--tertiary

Buttons on dark tint

Outline buttons will not work on dark-tint components.

White buttons

  • White button style. Intended for use only on dark backgrounds where contrast is sufficient. They will not work on light backgrounds.  button button--white
  • White outline button style. Alternative style for white buttons for when there are multiple buttons and only one is the primary action.  button button--white button--outline