All components

Actions components

Try the canonical actions families. Each specimen keeps its anatomy and behavior across all eight moods.

Choose your moodBeige mood selected

Actions / Canonical family

Button

A clear action with a 10 px radius and a practical touch target.

Choose an action to see its feedback.

Use it with intention

Choose primary for the next action, secondary for a supporting action, and ghost for a quiet action.

Keyboard & accessibility

Use a specific action label. Expose disabled and loading states with native semantics.

States: default, hover, focus, disabled, loading, destructive

Subtle authored presentation; Base UI and native HTML behavior.