· 1 min read
Tokens that survive handoff
Three rules that kept our design tokens from drifting between Figma and code.
- design systems
- process
Most token systems don’t fail on day one. They fail six months later, when a hot-fix hard-codes a colour and nobody notices.
1. Name the decision, not the value
color-danger-surface survives a rebrand. red-100 does not. If you can’t name what a token decides, it probably shouldn’t be a token.
2. One source, two outputs
We keep tokens in a single JSON file and generate both Figma variables and CSS custom properties from it. Nobody edits the outputs by hand.
3. Make the wrong thing loud
A lint rule flags raw hex values in components. It’s annoying for a week, then it’s just how the codebase works.
The best design system is the one people forget they’re using.