Fair Weather

Reference

Design system

Every ratio was computed with tools/a11y/contrast.py, not eyeballed. This page is noindex: it documents the template for whoever builds with it.

Colour tokens

--color-bg

#F7F9FA — Cool white — page ground

--color-bg-alt

#E9EEF1 — Rinse tint — banding

--color-text

#16242B — 15.05:1 on ground · AAA

--color-text-muted

#4F6068 — 6.20:1 on ground · AA

--color-accent

#146C94 — 5.52:1 on ground · AA — usable as text

--color-on-accent

#FFFFFF — 5.83:1 on accent · AA

--color-on-ink

#FFFFFF — 15.89:1 on ink band · AAA

--color-on-ink-muted

#C2CDD3 — 9.81:1 on ink band · AAA

--color-accent-on-ink

#5FC3E4 — 7.88:1 on ink band · AAA

--color-yes

#146C94 — Matrix: included · 5.83:1 on white

--color-extra

#8A5A12 — Matrix: on request · 5.91:1 on white

--color-no

#5F6B70 — Matrix: not included · 5.49:1 on white

--color-required

#8A2B2B — 8.08:1 on ground · AAA

Matrix key

Colour is never the only signal. Each state carries a glyph and a visually-hidden word, because the people most likely to read a checklist carefully are the least well served by “green means yes”.

Included On request Not included

Type

Domine — display

Onest — body. Neither font appears in days 1–77.

Buttons

Primary Secondary