One design system for every app you build
How a single set of tokens let a five-person team ship twelve products that still feel like one brand.
Two years ago every one of our apps had its own button. Some were rounded, some were square, and three of them were a slightly different shade of the same blue. Nobody decided that; it just happened, one pull request at a time.
Start with tokens, not components
The fix wasn't a component library. It was agreeing on the decisions underneath: which colors exist and what they are for, how round corners are, how much space sits between things. Once those were named, components mostly wrote themselves.
A design system is a set of decisions you only have to make once.
We store every decision as a CSS variable. A button doesn't know it's blue; it knows it's var(--primary). Switching a whole product's look is a one-line change:
<html data-preset="midnight" class="dark">What we'd tell our past selves
- Name colors by job (
--destructive), never by hue (--red). - Check contrast in the build, not in review.
- Let products override tokens, but never fork components.
The result: new products start looking finished on day one, and designers spend their time on the problems that are actually new.