Buttons
Buttons allow users to interact with the interface, selecting options and triggering actions. This guide explains how to use them.
-
Usage
-
Examples
-
Related component
-
Download
Usage
Primary Buttons
Primary Buttons exist to guide the user in the interface. Therefore, they should not be used excessively, otherwise the user might get confused on what to do next.
Secondary Buttons
SecondaryĀ Buttons support primary buttons but are lower in the hierarchy and therefore not as important. They should not be used for the most important (inter-)actions.
Text Buttons
Text Buttons simply consist of text and can be used as secondary buttons to display hierarchy.
Grouping
Buttons can also be used in groups that contain related actions. Ensure there is only one primary button to help focus and avoid confusing users. Grouping isnāt required, but sometimes it makes visual sense to separate related buttons from unrelated buttons.