RelayCTX™ Design system v3.6 · live

v3.6 — one source,
six generated adapters.

v3.6 is a pipeline release, not a redesign. The material is v3.5's; what changed is where it comes from. Every value and every ratio below is read from the linked token stylesheet at runtime — nothing on this page is typed in, so it cannot drift from what actually ships.

01 — The pipeline

Until v3.6 the direction was inverted: a hand-edited CSS file was canonical and the JSON was generated from it. That left 12 independent token files across 6 repos and 379 files carrying a literal teal, with one sync mechanism wired anywhere.

brand/relay-design-tokens.json

The only file a human edits.

↓ python3 scripts/build_tokens.py

generated/relay-tokens-v36.css

--rly-* — this estate

generated/relay-app-tokens.css

bare --* — app + console

generated/relay-mkdocs-v36.css

MkDocs Material adapter

generated/mcp-tokens.css

MCP display

generated/tokens.ts

React Native constants

generated/brand_colors.py

literal hex — email

Email clients and React Native cannot read CSS custom properties at all. That hard constraint is why this is a generator rather than one shared stylesheet — and why brand/generated/* is never hand-edited.

02 — The role split

The accent is not one colour with one job. It is split by role, and the roles carry different obligations — which is why two of them hold different values in light mode.

the mark — accent-ui

the button — accent-fill

In light mode these are two different greens, and that is correct. The mark is non-text, so it may be brighter. The button carries a label, so it must be darker. In dark mode there is one green and no split. At mark scale they barely separate — the difference only reads at button size.

03 — The two obligations

A button owes two contrast debts, and measuring only the first is how a broken value gets chosen. Ratios below are computed live from the tokens as loaded.

Pair	Obligation	Light	Dark

The brand green cannot carry white text. Fill it with --rly-accent-ui under white and it measures 3.74:1 — a property of the colour, not a preference. The muted button is not timidity; it is the only safe option in that direction. Which is why buttons draw the pair, --rly-accent-fill + --rly-on-accent, and never one half pinned to a literal.

04 — What actually changed

v3.6 defines every token v3.5 does — 35 light, 25 dark, none dropped. Dark mode is byte-identical. Exactly one light value moved:

Token	v3.5	v3.6	Why
--rly-indigo	retired value	—	The old value measured 4.467:1 — missing AA by 0.03 while carrying 11–13px copy.

So the sweep's only visual effect anywhere is indigo picking up its contrast margin. That is what made repointing 105 pages safe to do in bulk — verified before sweeping, by parsing both files, rather than after.

05 — The ink flip: settled, do not re-propose

A brighter --rly-accent-fill carrying near-black ink in light mode — the way dark mode already does — was built, rendered across all 29 app screens, and rejected on sight: “green with black text, it's odd.”

Both its contrast obligations passed. That is the point. It measured 4.94 label / 3.75 page and had shipping precedent. The numbers cleared it and looking at it did not — which is exactly why it was drawn before being adopted. Do not re-derive it from the ratios; the record is /concepts/ink-flip.

06 — Where adoption stands

v3.6 is the floor for everything live in this estate. What sits behind it does so deliberately — or is a known, named gap.

105

pages on v3.6

Plus the Pages middleware that renders the Unfiled (auto) listings.

held on v3.5, by design

Pages carrying an explicit ARCHIVED stamp keep the material they shipped with.

still on v3.4 — open

decks/origin-slide-roundtable.html, the only unstamped page left on v3.4. Not a repoint: v3.4's teal-tinted surfaces were retired in v3.5, so it would change appearance. Wants a look. (brand/brand-guide.html is also on v3.4 but is carded as an archive — that one is the record.)

no token file at all — open

coming-soon, concept-c, holding under marketing/web/, carrying 12 / 21 / 9 hardcoded values. Needs a call on whether they are still live.

Outside this estate, one live defect. The cookie-consent Accept button on relayctx.com fills with a non-text token under a hardcoded white — 3.74:1, failing AA in public. Fixed here; the apex copy in relay-platform still carries it, and that repo is owned by a separate session.