Visual identity

Style

The palette this site renders with, shown as it is served.

Reference · stands where the printed colors.pdf card stood

Every colour on this site is one of the roles below. Templates and stylesheets name a role and never a hex, and the generator resolves that role from the palette each time a page is rendered — so the swatches here are the live custom properties, not a copy of them, and this page cannot drift from the pages around it.

Roles

background
#ffffff
surface
#f8fafc
Panels, tinted sections, table stripes.
heading
#1f2937
body
#1f2937
muted
#6b7280
Captions, labels, metadata.
rule
#e5e7eb
Hairlines and borders.
accent
#3730a3
The mark, links and emphasis.
accent
on accent
#ffffff
Text that sits on an accent fill.
ok
#10b981
warn
#d97706
bad
#ef4444

Rules

  • Ask for a role, never a hex. A literal colour in a stylesheet is a bypass: it stays put when the palette is reassigned.
  • ok, warn and bad mark state and nothing else. Used decoratively they cost the palette the one thing it is for — saying that something is wrong.
  • Colour is assigned per surface, in one place. Outbound work renders in this palette; internal tools render in a second one, so a screenshot tells you whether a client could see what is in it.