Skip to main content

Button

Information: Documentation incomplete

This component still requires documentation.

Use the button component to trigger an action or as a call to action.

Examples

Default

Open example in a new window
View HTML 
<button class="uhb-c-button" type="submit">Submit</button>

Inverse

Open example in a new window
View HTML 
<button class="uhb-c-button uhb-c-button--inverse" type="submit">Submit</button>

Action

Open example in a new window
View HTML 
<button class="uhb-c-button uhb-c-button--action">
  <svg class="uhb-c-icon  uhb-c-icon--menu" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false">
    <path d="M2 2H22V6H2V2Z M2 10H22V14H2V10Z M22 18H2V22H22V18Z"></path>
  </svg>
  <span class="uhb-u-visually-hidden">Open menu</span>
</button>