Dark-first, engineer-grade
This is infrastructure tooling. The palette is a near-black blue with surfaces one step lighter and thin hairline borders, closer to a clean architecture drawing than a glossy marketing page.
Design system
Tokens, type, and the rules behind the look
Everything on this site is built from a small, dark-first token set and two typefaces. This page is the reference; the same tokens live in globals.css.
Color
- bg#0b1016page
- surface-1#10161fcard
- surface-2#141b26elevated
- border#233247hairline
- text#e6edf3body
- text-dim#9bb0c4secondary
- text-muted#6b8199tertiary / mono meta
- accent#ff9900compute amber
- status-ok#3fb950proven / pass
- status-warn#d29922human-gated
- status-fail#f85149stop / danger
Typography
Space Grotesk · headings & body
Configure the whole stack
A clean geometric sans, confident and technical, never playful.
JetBrains Mono · IDs, numbers, provenance
L5 · 342 · 100%
commit=0000000 image=…@sha256:… at=2026-07-09T14:22Z
Principles
Status colors carry meaning
Green means proven. Amber means human-gated. Red means stop. They map directly to the trust story and are never used decoratively.
Mono on every ID and number
Layer IDs (L0, L5, L10), counts, and provenance blocks are always set in JetBrains Mono. A deterministic tool should look precise.
Schematic motion only
Signal rising through the stack, a pipeline lighting up, a population evolving. Nothing bouncy: precision, not flash. No stocky AI imagery.
radius
10px
content max-width
1080px
motion
reduced-safe