Skip to content
Design System

Icon buttons

Icon buttons (like Buttons) let users take action. Used for repeated or persistent actions on a page or toolbar, they lack visible labels to simplify the UI.

Design

Section titled “ Design”

Variants

Section titled “Variants”

Selected State

Section titled “Selected State”
3

In Practice

Section titled “ In Practice”

Increase clarity

Section titled “Increase clarity”

Include a Tooltip to help any users who may be unfamiliar with the icon.

Accessibility

Section titled “ Accessibility”

Screen reader support

Section titled “Screen reader support”

Set the aria-label HTML attribute to its action (e.g., “Next”, “Delete”, “Resolve”, etc.). Learn about aria-labels.

Design resources

Section titled “ Design resources”
View component in Figma