Brand
The Modern Relay brand system, shared with the Omnigraph site. Everything on this page renders from the package itself, so what you see is what ships.
@modernrelay/brand · packages/brand
[Marks]
Modern Relay
mark: @modernrelay/brand/mark · dot square, 5×5 minus cornersicons.tsx
The mark is dotted, so the wordmark beside it always sets solid — one texture at a time, never Doto next to the mark.
[Lockups]
logos/mr-lockup.svg · 729×115
logos/og-lockup.svg · 723×134
[Palette]
Blue explorations →accent#0044ffThe single interrupt — interactive elements only
accent-subtlergba(0, 68, 255, 0.12)Accent wash (12%)
ink#1b1b1fInk bands, active blocks
black-200#1a1a1aText primary
black-100#333333Running text
black-50#666666Labels, metadata
grey-400#999999Disabled, strong hairlines
grey-300#e2e2e2Seams, tile hover
grey-200#e8e8e8Module tiles
grey-100#f0f0f0Quiet blocks (quotes)
paper#f8f8f8Page field
white-100#ffffffCards, chips
[Type]
Space Grotesk
Headings and running text
Space Mono
Labels and data, mono uppercase
Doto
Dot matrix — Omnigraph display only; never beside the dotted mark
displayModern Relay
h1Modern Relay
h2Modern Relay
h3Modern Relay
h4Modern Relay
body-lgModern Relay
bodyModern Relay
body-proseModern Relay
smallModern Relay
labelModern Relay
label-smModern Relay
xsModern Relay
[Modules]
Module tilebg-grey-200 · rounded-[10px]
Quiet blockbg-grey-100 · quotes, asides
Ink bandbg-ink · one per page
Blocks sit flat on the paper field, separated by 3px seams — no borders, no shadows. Hierarchy is the fill; the accent marks action and nothing else.