Button

Complete an action

When to use buttons?

Buttons are used to complete actions or events. They let you know exactly what action will take place if a user interacts with them.

When you need users to complete an action

To navigate or create link between internal or external pages.

Primary button Use a primary button to call attention to main actions on page or section, or to highlight the strongest call to action on a page.	Secondary button Use a secondary button with a primary button for secondary actions.	Tertiary button The tertiary button is usually used for low-priority actions, when we have repetitive actions or when there is a high number of actions in the same component.

Format

DO	DON'T
Use always the same padding to wrap the button.	Use different padding to wrap the button.

DO	DON'T
Use always primary button with secondary button if there are more than one action.	Use multiple primary button in the same area if there are more than one action.

DO	DON'T
Use the same size for the buttons placed next to each other.	Use different size of button next to each other.