Visual Foundations
Consistency & standards
The same thing should look and behave the same way everywhere.
See it
Spot the problem
Why it matters
Same function, same look. The 'Link' button uses a different border, font, color and radius, so it looks like a different kind of thing.
How to apply it
- Build buttons, inputs and cards as reusable components
- Keep one style per role: primary, secondary, destructive
- Follow platform conventions users already know
Common mistakes
- One-off button styles for special pages
- The same word meaning different things in different places
Quick answers
What is Consistency & standards?
The same thing should look and behave the same way everywhere. Same function, same look. The 'Link' button uses a different border, font, color and radius, so it looks like a different kind of thing.
How do I apply Consistency & standards in UI design?
Build buttons, inputs and cards as reusable components. Keep one style per role: primary, secondary, destructive. Follow platform conventions users already know.
What are common mistakes with Consistency & standards?
One-off button styles for special pages. The same word meaning different things in different places.