Every design system talks about tokens. Almost none survive their first real rebrand. The failure is always the same: tokens named after what they look like instead of what they mean.
The three layers
Layer one is raw values: blue-600, space-4, radius-lg. Layer two is semantic roles: surface-raised, text-muted, action-primary. Layer three is component bindings: button-bg maps to action-primary. Components may only reference layers two and three — never a raw value.
A rebrand then touches exactly one file: the mapping from roles to raw values. We have re-skinned five products on this architecture; the largest rebrand changed 40 lines and zero components.
Where teams go wrong
The tempting shortcut is skipping layer two — binding components straight to raw values because "we can rename later". Later never survives contact with a deadline. The second failure is letting one-off exceptions bypass the system; every hardcoded hex is a landmine the next redesign steps on.
Tokens are not a styling convenience. They are an insurance policy, and the premium is discipline.