Design documented
The component is fully documented
React documented
Flutter documented
Design
Is the design finished and component available in Figma library?
Up to date
React
Is new design vision part implemented using new tokens?
Up to date
Flutter
Is new design vision part implemented using new tokens?
Up to date
Introduction
Buttons are clickable or tappable elements that are used to trigger actions. They communicate calls to action to the user, and allow users to interact with pages in a variety of ways. Button labels express what action will occur when the user interacts with it.
When to use
Use buttons to communicate actions users can take and to allow users to interact with the page. Each page should have only one primary button, and any remaining calls to action should be represented as lower emphasis buttons.
When not to use
Do not use buttons as navigational elements. Instead, use links when the desired action takes the user to a new page.
Related components & guidelines