Colophon
Page briefing
This is the Colophon: the typefaces, colors, and build stack behind Wax+Wires, plus a plain accounting of what this site measures.
Type: three typefaces. Economica for display and headlines, Atkinson Hyperlegible for body text, designed for readability at any size, and Courier Prime for mono captions and timestamps.
Palette: four colors. Hot Red, Ink Black, Engine Cream, and Slate.
Theme: light, dark, and system, switchable from the header and remembered on this device. Every colour pairing the interface uses is measured for contrast in both themes; 23/23 pairings currently pass the WCAG A.A. floor.
Build: Astro 6, a static site with M.D.X. content, hosted on Cloudflare Pages, self-hosted fonts, hand-rolled C.S.S. with no frameworks, content kept in git.
Philosophy: this site is built with Authored Intelligence — human-directed, AI-accelerated. Every word and every design decision is made by a human; AI helps execute, never leads. No dark patterns, no surveillance dressed as insight, no engagement traps. That covers words and design; for how audio reads and AI involvement are disclosed, see the Disclosure page.
What this site measures: traffic is measured with Umami — no cookies, no fingerprints, no individual profiles. In aggregate and anonymously, it also counts how many visitors arrive with reduced-motion, high-contrast, or forced-colors turned on, and whether the skip-link gets used — four coarse flags, used only to build for those needs. Essays with video or narration also count plays and completions, same rules, aggregate only.
This page has no actions beyond following the external links to Astro, Cloudflare Pages, and Umami.
Type
Economica
Display · Headlines · Wordmark — Bold Condensed, all-caps, mis-registered.
Atkinson Hyperlegible
Body · Essays · Captions — Designed for readability at any size.
Courier Prime
Mono · Zine captions · Timestamps — Typewriter warmth.
Palette
- Hot Red
#E70033 - Ink Black
#1A1A1A - Engine Cream
#FCF9E9 - Slate
#3C3C3C
Contrast
Belief number five is "receipts on everything," so here is the receipt on colour. Every text-and-background pairing this interface actually uses is measured — not eyeballed — against the WCAG A.A. contrast floor (4.5 to 1 for body text, 3 to 1 for large text), in both the light and dark theme, by a build script that reads the real design tokens and fails the build if any pairing drops below the line. 23/23 pairings currently pass.
| Pairing | Theme | Colours | Ratio | Required | Result |
|---|---|---|---|---|---|
| Body textParagraph copy on the page surface | light | #1A1A1A on #FCF9E9 | 16.46:1 | ≥4.5:1 | Pass |
| Body textParagraph copy on the page surface | dark | #FCF9E9 on #141311 | 17.57:1 | ≥4.5:1 | Pass |
| Body text (alt surface)Prose inside asides/cards | light | #1A1A1A on #F7F7F5 | 16.23:1 | ≥4.5:1 | Pass |
| Body text (alt surface)Prose inside asides/cards | dark | #FCF9E9 on #1E1C18 | 16.09:1 | ≥4.5:1 | Pass |
| Muted textCaptions, timestamps, footer meta | light | #3C3C3C on #FCF9E9 | 10.44:1 | ≥4.5:1 | Pass |
| Muted textCaptions, timestamps, footer meta | dark | #ADA795 on #141311 | 7.73:1 | ≥4.5:1 | Pass |
| Muted text (alt surface)Aside copy, zine captions on cards | light | #3C3C3C on #F7F7F5 | 10.28:1 | ≥4.5:1 | Pass |
| Muted text (alt surface)Aside copy, zine captions on cards | dark | #ADA795 on #1E1C18 | 7.08:1 | ≥4.5:1 | Pass |
| Headingsh1/h2/h3 — bold, >=1.3rem, large-text threshold | light | #000000 on #FCF9E9 | 19.87:1 | ≥3:1 | Pass |
| Headingsh1/h2/h3 — bold, >=1.3rem, large-text threshold | dark | #FFFFFF on #141311 | 18.57:1 | ≥3:1 | Pass |
| Link / accent textHover links, eyebrows, active tags | light | #C4002B on #FCF9E9 | 5.87:1 | ≥4.5:1 | Pass |
| Link / accent textHover links, eyebrows, active tags | dark | #FF4D70 on #141311 | 5.79:1 | ≥4.5:1 | Pass |
| Link / accent text (alt surface)Eyebrows/tags over alt surface | light | #C4002B on #F7F7F5 | 5.79:1 | ≥4.5:1 | Pass |
| Link / accent text (alt surface)Eyebrows/tags over alt surface | dark | #FF4D70 on #1E1C18 | 5.30:1 | ≥4.5:1 | Pass |
| On-dark block textDark-hero header, footer/.surface-dark ink-block motif (brand-constant, not theme-relative) | constant | #FCF9E9 on #000000 | 19.87:1 | ≥4.5:1 | Pass |
| On-dark accent textLinks inside the ink-block motif | constant | #FF4D70 on #000000 | 6.55:1 | ≥4.5:1 | Pass |
| Panel / swatch text (white on red).panel-red utility; Colophon "Hot Red" swatch label | constant | #FFFFFF on #E70033 | 4.72:1 | ≥4.5:1 | Pass |
| Swatch label (on ink black)Colophon "Ink Black" swatch label | constant | #FCF9E9 on #1A1A1A | 16.46:1 | ≥4.5:1 | Pass |
| Swatch label (on slate)Colophon "Slate" swatch label | constant | #FCF9E9 on #3C3C3C | 10.44:1 | ≥4.5:1 | Pass |
| Swatch label (on cream)Colophon "Engine Cream" swatch label | constant | #1A1A1A on #FCF9E9 | 16.46:1 | ≥4.5:1 | Pass |
| Hero text on oxblood (cream)Light-theme home hero: headline, eyebrow, dek, caption — all cream on oxblood | constant | #FCF9E9 on #5C0A0A | 13.22:1 | ≥4.5:1 | Pass |
| Panel (dark) muted textFigure captions/notes inside a full-bleed <Panel theme="dark"> (englyn-overview) — forces black ground regardless of theme | constant | #ADA795 on #000000 | 8.74:1 | ≥4.5:1 | Pass |
| Panel (dark) headingsh2 section title inside a full-bleed <Panel theme="dark"> — forces black ground regardless of theme | constant | #FFFFFF on #000000 | 21.00:1 | ≥3:1 | Pass |
Build
- Framework — Astro 6 · Static site, MDX content
- Hosting — Cloudflare Pages
- Type — Self-hosted (Economica, Atkinson Hyperlegible, Courier Prime)
- Styling — Hand-rolled CSS custom properties. No frameworks.
- Content — MDX files in git. Humans keep the pen.
Philosophy
This site is built with Authored Intelligence — human-directed, AI-accelerated. Every word is written by a human. Every design decision is made by a human. AI helps execute, never leads.
No dark patterns. No surveillance dressed up as insight. No engagement traps. Just signal.
That covers words and design. For how audio reads and AI involvement are disclosed, see Disclosure.
What this site measures
Belief number five is "receipts on everything," so here is the receipt on this page. Traffic is measured with Umami — no cookies, no fingerprints, no individual profiles, nothing that follows you anywhere off this site.
One thing worth naming plainly: in aggregate and anonymously, this site counts how many visitors arrive with reduced-motion, high-contrast, or forced-colours turned on, and whether the skip-link gets used. Four coarse flags, nothing that could identify a person. I measure it for a single reason — to build for those needs instead of guessing at them. That is the opposite of surveillance. It is belief number six, done in the open.
If an essay includes a video or a narration, I also count plays and completions — in aggregate, same rules as everything else: no cookies, no profiles, nothing that identifies you.