Field note · Design systems
Design tokens are organizational infrastructure
The interesting part is not the variables. It is the decisions, boundaries, and shared language they make possible.
Tokens are decisions with names
A design token often enters a codebase as a small technical convenience. A hex value becomes color-accent. Sixteen pixels becomes space-4. A shadow gets pulled out of a component and given a home.
That cleanup is useful, but it is not the interesting part.
The interesting part begins when a team has to agree on what “accent” means, where it may be used, who can change it, and what should happen when a new brand or product needs something different. At that point the token is no longer just a variable. It is a tiny piece of organizational infrastructure.
A token creates a boundary
Good tokens separate a decision from the places that consume it. A component asks for a border color; it does not need to know which particular charcoal currently satisfies that role. A page asks for standard spacing; it does not need to renegotiate a rhythm from raw pixel values.
That boundary creates leverage in several directions:
- Design can discuss roles instead of chasing individual instances.
- Engineering can change a shared decision without searching for every copy of its value.
- Product teams can understand which choices are supported and which ones create a new exception.
- Accessibility work can improve a semantic pairing at its source.
- A rebrand can become a controlled systems change instead of a scavenger hunt.
The token is small. The agreement around it is not.
Primitive and semantic are different jobs
I like to keep two color layers visible.
Primitive tokens describe the available material: a particular rust, slate, paper, or near-black. Semantic tokens describe the job: canvas, panel, text, border, focus, accent.
Components should usually consume the semantic layer. That makes their intent legible and keeps a palette change from leaking into their API. The primitive layer still matters because it records the actual visual system and gives designers a controlled vocabulary for extending it.
When those layers collapse into one, names become misleading. A component that requests blue-500 is really encoding two decisions at once: what the color is and what it is for. Those decisions rarely change at the same rate.
Governance can stay lightweight
“Governance” sounds like a committee with a long agenda. It can be much simpler.
For a small system, useful governance might mean:
- Every token has a clear role and a short description.
- New tokens must represent a reusable decision, not one awkward instance.
- Semantic tokens reference primitives rather than repeating their values.
- The code and design-library names match closely enough to compare.
- Contrast and interaction states are checked before a token becomes broadly available.
That is enough to turn tokens from a bag of constants into a dependable interface between disciplines.
The migration reveals the organization
Token work has a useful side effect: it exposes where a team has been making the same decision differently.
You find four grays that all mean “muted text,” three border radii competing for the same kind of card, and a focus color that disappears on one of the most common surfaces. Those are not merely visual inconsistencies. They are evidence that ownership or intent has been unclear.
A thoughtful migration does not just replace values. It asks which differences are meaningful, which are accidental, and which product constraints the system has failed to name.
The real deliverable is shared judgment
The best outcome is not a perfect token file. It is a team that can make compatible decisions without routing every choice through one person.
Tokens help because they make judgment inspectable. Their names show intent. Their aliases show relationships. Their documentation records constraints. Their use in components demonstrates what the system means in practice.
That is why I think of design tokens as organizational infrastructure. They are a compact way to encode how a team sees its product — and a practical way to help the next good decision resemble the last one.