Design Systems & Tokens

A design system earns its cost at the point where the tokens make the wrong choice difficult rather than merely discouraged.

How I use it

Contrast checked by hand, once
Every colour is an OKLCH token with light and dark ramps, so accessible contrast is a property of the system instead of something an audit claws back later.
Colour ramps that go wrong at certain hues
OKLCH is perceptually uniform, so a step in lightness looks like the same step across every hue. In hex you are guessing, and the guess is worst exactly where it shows — yellows and cyans.
Type that only reads correctly at breakpoints
Fluid scales built on clamp so the page is legible between breakpoints as well as at them.
Components missing their interaction states
Hover, focus-visible and disabled defined in the component rather than left to the consumer. An unstyled focus ring is an accessibility bug that ships silently.

Want the detail behind any of this?

I can walk through any of it in as much depth as you want.