Skip to results
UX Handbook
/
×
tfmstyle.com
→
Load more
Design Component Anatomy
Components · components
Updated 2026-07-28
Every component should have a clear structure.
Define:
Purpose
What problem does this component solve?
Content
What information does it display?
States
Default.
Hover.
Active.
Focus.
Loading.
Error.
Disabled.
Behavior
How does it respond?
Responsive rules
How does it adapt?
A component is not complete because it looks good. It is complete when its behavior is defined.
Related guides
Design Component States Completely
Design Component States
Design Rating Components That Give Honest Feedback
Design Component Accessibility
Design Component Architecture
UX Handbook