Skip to content
Living Pagebrand
Chapter 03

Warm
paper

A cream ground, warm greys, and exactly one indigo accent. Hover a column to open it. Click to copy the hex — and paint this page with it.

The palette

The one-accent rule

Primary actionTinted surface

Indigo carries meaning: it marks the one thing to do next. If two indigos compete on a screen, one of them is wrong. Chart colours are for data only — never UI.

Border versus input

--border is decorative only: card edges, dividers, separators. Light enough to read as a hairline.

--input is the boundary of a real control. In light it sits at 1.51:1 — a deliberate exception for a softer field. #918a79 is the tested value to return to if compliance is required.

Take the tokens

↓ tokens.css↓ tokens.json
Next — 04Typography