The Brief
The old system had aged well in places and badly in others. Buttons still worked; the grid had started to fight every new layout we asked of it.
So we gave ourselves a rule: nothing ships until it survives a real page, not a component sandbox.
First Drafts
The first pass leaned hard into density. More tokens, more variants, more control. It was thorough and it was exhausting to use.
We shelved it after a week of dogfooding and started again with a smaller surface area.
What Changed
Three decisions carried the rest of the project.
- Spacing became a single scale instead of six overlapping ones
- Every component picked up a container query before a viewport one
- Dark mode stopped being an afterthought bolted on at the end
The Details
Small things took the longest: focus rings that held up in every theme, motion that respected reduced-motion settings, numbers that read correctly in every locale.
None of it is visible in a screenshot. All of it shows up the first time something breaks.
Closing Thoughts
A year is a long time for a redesign nobody asked for out loud. It was worth it the first week nobody had to work around the grid.