/colophon

stack

design

One column, 68ch wide, monospace throughout. Every colour is derived from a single custom property — --bg-l, the background lightness — so dark mode is one number, not a second palette:

--color-bg:   hsl(var(--bg-h) var(--bg-s) var(--bg-l));
--color-text: hsl(var(--bg-h) calc(var(--bg-s) + 6%)
                  clamp(10%, calc(100% - var(--bg-l)), 92%));

/* everything between the two is a mix of the two */
--color-border: color-mix(in oklab, var(--color-text) 16%, var(--color-bg));
--color-muted:  color-mix(in oklab, var(--color-text) 58%, var(--color-bg));

Headings are numbered with CSS counters, so a long page reads like a spec. Lists respond to j and k.

privacy

No analytics, no cookies, no third-party fonts, no embedded scripts. The only JavaScript on the page is the theme toggle and the keyboard nav, both inline and both under 40 lines.

credit

The layout owes a lot to edleeman.co.uk and the wider small-web / indieweb tradition of text-first personal sites.