Skip to results

Design Component States

Components · components, states

Updated 2026-07-28

Components are systems, not pictures.
Every component should define:

Default:

Normal state.

Hover:

Pointer interaction.

Focus:

Keyboard interaction.

Active:

Pressed state.

Disabled:

Unavailable.

Loading:

Processing.

Error:

Failed.

Missing states create inconsistent products.

Related guides

Design Component States Completely
Design Component Anatomy
Design States, Not Screens
Design Component Accessibility
Design Rating Components That Give Honest Feedback