Design

Buttons: Best practices

Updated: Feb 27, 2026

Recommended practices for using buttons in immersive experiences.

At a glance

Primary	The most common, recommended action. Use for the single highest-priority action in a view.
Secondary	Medium-emphasis actions such as inverse, continuation, or supporting actions.
Borderless	Low-emphasis actions without a background. Use to maintain focus on other actions.
Destructive	Actions that delete data or end sessions. The red color signals caution.
Destructive alt	A destructive action that is not the primary button in the view.

Do’s and don’ts

DO Use short, specific labels that clearly describe the action (for example, "Save", "Delete", "Continue").

DO Use one primary button per view to establish a clear visual hierarchy.

DO Ensure hit targets meet the minimum size of 48dp x 48dp for reliable targeting.

DON'T Use vague labels like "Click here" or "Submit" when a more descriptive label is available.

DON'T Place multiple primary buttons side-by-side — use secondary or borderless variants for lower-priority actions.

DON'T Use a destructive button for non-destructive actions. Reserve the red color for actions that delete data or end sessions.

Key considerations

Consistency: Maintain the same button variant for the same type of action across your entire experience.

Visual hierarchy: Pair a primary button with secondary or borderless buttons to guide user attention toward the recommended action.

Feedback: Provide clear hover, pressed, and disabled states so users always understand the current interaction state. See Specs for state details.

Did you find this page helpful?