The Problem With Our Old System
After three years and more than forty client projects, our component library had quietly become a liability. Every new project meant forking a Button component that already had six variants nobody remembered the reasoning for. Design and engineering had drifted apart — Figma said one thing, the codebase said another, and the gap between them was measured in weeks of rework per project.
None of this happened on purpose. It’s what happens to any design system that grows one ticket at a time without anyone stepping back to ask whether the foundation still made sense.
“We didn’t have a design system problem. We had a decision-fatigue problem, and the components were just where it showed up.”
Rebuilding Around Tokens, Not Components
The instinct when a component library gets messy is to redesign the components. We did the opposite — we started one layer down, at design tokens: color, spacing, type scale, radius, motion. Every component became a thin, almost boring layer on top of tokens that were themselves the single source of truth, synced automatically between Figma and code.
- Every color, spacing value, and radius now lives in one token file — not fourteen different Sass variables.
- Components consume tokens; they never hardcode a value themselves.
- A token change now propagates to every product surface without a single manual edit.
What Actually Changed for the Team
The result wasn’t just cleaner code — it changed how design and engineering talk to each other. A designer changing a spacing token in Figma now sees that exact change reflected in the next build, not a close approximation of it. That single alignment cut our build times by roughly 30% across the three client projects we’ve shipped since.
What We’d Tell a Team Starting This Today
If you’re staring down the same rebuild, the biggest trap is trying to migrate everything at once. We ran the old and new systems side by side for two full sprints, moving one product surface at a time, and it saved us from the kind of big-bang rewrite that usually stalls out around week six.
Start with tokens, not components. Everything else gets easier once that foundation is real instead of aspirational.