← Index / Docs / Design Spec v3.4
Active v1.0 · June 2026

Design Spec v3.4

Surface-by-surface spec for the v3.4 design system rollout. One system, every surface, no legacy holdovers.

Active Owner: EC / Ada Scope: Full platform June 2026 Replaces BRIEF.design-v34.md
§ What v3.4 is

Theme

One system. Every surface. No legacy holdovers.

v3.3 locked the token system and type stack. v3.4 ships it across every surface — resolving font inconsistencies, applying locked vocabulary (V&V Sessions 0–1), porting legacy prototypes, and designing new surfaces (Spaces, social graph).

§ Progress summary
Surface Prototype Production
App UI
v3.4 existing
⚠️ vocab pending #145
Console
v3.4 Jun 5
not started
Auth System
v3.4 Jun 5
not started
Marketing Site
Concept C Jun 5
direction lock pending
Email (5 files)
v3.4 Jun 5
⚠️ Session 3 vocab pending
MCP reference
⚠️ partial
not started
Mobile
⚠️ Phase 3
⚠️ vocab pending
Spaces
not designed
gated on build
Design system ref
⚠️ partial
§ Fonts
Specimen Role Family Weight
Context version control.
Display / hero headlines Cormorant Garamond italic 300–400
Body · UI · Nav · Labels · Buttons
ALL body, UI, nav, labels, buttons, wordmark Outfit 300–600
K886XH · 2026-06-07T14:32Z
Codes, timestamps, monospace only JetBrains Mono 400–600
Retired — do not use:  Syne  ·  IBM Plex Sans  ·  DM Mono
§ Tokens
--bg
#ffffff
Page background
--surface
#f7f7f7
Card backgrounds
--panel
#f0f0f0
Panel / inset areas
--border
#e4e4e4
Default borders
--border-hi
#cccccc
Hover / emphasis borders
--text
#111111
Primary text
--text-2
#555555
Secondary text
--text-muted
#999999
Muted / meta text
--teal
#0d9488
PRIMARY — touch points only
--teal-dim
rgba(13,148,136,0.08)
Teal tinted fill
--indigo
#6366f1
SECONDARY — org/team/pro tier
--success
#16a34a
Received state
--warning
#d97706
Pending / expiring
--error
#dc2626
Expired / failed
Dark mode — [data-theme="dark"] · opt-in only
--bg #0d0d0d
--surface #181818
--teal #2dd4bf
--indigo #818cf8
§ Rules
  • Flat — no drop shadows, no gradients (exception: teal→indigo bar in brand hero moments)
  • Touch points only — teal/indigo on buttons, active states, Codes, badges, focus rings only
  • Light is primary — dark is [data-theme="dark"], opt-in
  • Cards: --surface bg · 0.5px --border · 8px radius · 16px padding
  • Focus: 3px rgba(13,148,136,0.25) box-shadow
§ Vocabulary
Old (retired)New (locked)
PIN / relay ID / Relay CodeCode
Claimed / claim / acceptReceived / receive
handoffrelay (user) / transfer (API)
contributionItem
Org-visibleOrg
CLAIMS TODAYRECEIVED TODAY
1 Prototype Index
Prototype Index
Syne font — needs Outfit swap
In progress
↗ prototype.relayctx.com
  • font-family: 'Syne''Outfit' throughout
  • Spaces section added (stub cards)
  • All pre-v3.3 cards version-bumped
2 App
App (relay-app)
v3.4 prototype exists. Production vocab pending (#145).
Vocab pending
↗ prototype.relayctx.com/web/app-v34
  • relay-app production: vocab pass applied (issue #145)
  • Space detail page designed + prototyped
  • Space badge component shipped
  • "In common" profile display designed
  • Relay card with PR #784 display spec applied
3 Console
Console (relay-console)
✅ v3.4 prototype built June 5, 2026
Prototype done
↗ prototype.relayctx.com/web/console-v34
  • Font: Outfit + Cormorant Jun 5 2026
  • Tokens: neutral surface/border set Jun 5 2026
  • Vocab: "Received" not "Claimed" throughout Jun 5 2026
  • Spaces admin view (#692): Space list, member management, visibility controls
  • Production implementation matches prototype
4 Auth System
Auth System
✅ v3.4 prototype built June 5, 2026
Prototype done
↗ prototype.relayctx.com/web/auth-v34
  • Font: Outfit body, Cormorant italic for auth headlines Jun 5 2026
  • Tokens: neutral set Jun 5 2026
  • Vocab: "Code" not "PIN/Relay Code" throughout Jun 5 2026
  • Production implementation matches prototype
5 Marketing Site
Marketing Site
✅ v3.4 prototype built June 5, 2026. Direction: Concept C.
Prototype done
↗ prototype.relayctx.com/web/web-v34
  • Font: Cormorant Garamond italic hero, Outfit body Jun 5 2026
  • Tokens: v3.4 neutral set Jun 5 2026
  • Vocab: "Code", "Receive", "Received", capitalised "Codes" throughout Jun 5 2026
  • Direction: Concept C — Code hero figure, 4-step loop, MCP integration block, 4-tier pricing, "Context in. Context out." close Jun 5 2026
  • Session 4 vocab audit applied
  • Site direction formally locked by EC
  • Production deployment
6 Email & Notifications
Email & Notifications
✅ All 5 transactional emails updated June 5, 2026
Resend pending
  • Font: Outfit + Georgia fallback Jun 5 2026
  • Tokens: neutral set, #e4e4e4 borders Jun 5 2026
  • Vocab: "Code", "Received", "receive"; relay-claimed → relay-received copy Jun 5 2026
  • Code display: JetBrains Mono / monospace, teal, 0.15em tracking Jun 5 2026
  • Entity: Relay Context Inc. Jun 5 2026
  • Session 3 (Comms vocab audit) applied
  • Resend/send integration verified
7 MCP Reference
MCP Reference
relay-card-display ✅ built (v3.3). response-cards needs port. relay-edit-timeline missing.
Partial
↗ relay-card-display ��� response-cards
  • relay-card-display built in v3.3 Jun 3 2026
  • relay-card-display Syne → Outfit font swap
  • response-cards ported from dark IBM Plex to v3.4 light
  • relay-edit-timeline built (gated on PR #784 merge)
8 Mobile
Mobile
Phase 3 shipped. Spaces mobile pending build.
Vocab pending
  • Session 1 vocab applied to mobile copy
  • Spaces mobile view (#46) — gated on Spaces v1
  • Relay card display spec applied (PR #784)
9 Design System Reference
Design System Reference
relay-tokens.css fixed (Jun 3 2026). relay-design-system.md body still v3.2.
Partial
  • relay-tokens.css comment corrected: Outfit not Syne Jun 3 2026
  • TEAM-HANDOFF-v34.md created for app + console teams Jun 3 2026
  • relay-design-system.md body updated to v3.4
  • relay-brand-guide.html updated to v3.4
  • Spaces entity tokens defined (gated on Spaces v1)
New Surfaces — Spaces

Gated

No designs exist yet. All gated on Spaces v1 (#681–#692).

SurfaceIssueNotes
Space badge on relay/pulse#686[● Space Name] inline chip, teal
Space detail page#687Name, visibility badge, mixed timeline, members
Space creation + management#688Visibility selector: Private/Org/Connected/Open
Space directory#685Org-visible list, search, filter
Profile integration#690Spaces on profile, "in common" display
Admin view#692relay-console
§ Dependencies & Gates
ItemBlocked on
Spaces design blocked  Spaces v1 build (#681–#692)
Marketing production blocked  Site direction lock (EC)
Sessions 2–6 vocab blocked  Running the sessions
relay-edit-timeline blocked  PR #784 merge
Console Spaces admin blocked  Spaces v1 build