Named, reusable values that store the smallest design decisions — like a specific color, font size or amount of spacing — so they can be updated in one place and applied everywhere. Instead of writing '#5B2AE0' many times, you use a name like 'color-brand-primary'.
Synonyms
- design variables
- tokens
Related terms
In plain words
- named settings for colors, fonts and spacing you can change in one spot
- nicknames for design values so you don't hardcode them
Usage example
Switching the brand color everywhere took minutes because it was stored as a single design token.
Don't confuse with…
- variableA design token is a design-specific value with a meaningful name; a variable is the general programming container that might hold one.
Categories
- Design systems