RelayCTX™ Brand cheat sheet · pack v3.5.3 · design system v3.6

The whole identity,
on one screen.

Grab-and-go for profiles, decks, and pages: every approved file with a direct download, the six colours, the three faces, and the rules that keep it canon. Depth lives in the brand guide and the asset pack.

01 — Lockup

RelayCTX horizontal lockup

Horizontal — the default

Teal mark, ink wordmark, ™ on first use. PNGs are transparent.

SVG PNG 408 PNG 816
RelayCTX stacked lockup

Stacked — square spaces

Mark above wordmark, for centred and square layouts only.

SVG PNG 336 PNG 504
RelayCTX one-ink lockup

One ink — “black”

Everything in brand ink #111111. For single-colour contexts.

SVG PNG 408 PNG 612
RelayCTX white knockout lockup

Knockout — white

Shown on --rly-accent-fill #0f766e, the ground white is actually cleared for at 5.47:1. Never the brand green #0d9488 — white on it is 3.74:1 and fails.

SVG PNG 408 PNG 612

02 — Mark alone

Open Signal mark, teal

Open Signal — spec teal

The mark, #0d9488. Canonical SVG inherits currentColor.

SVG PNG 512 PNG 1024
Open Signal mark, one ink

Mark — one ink “black”

Brand ink #111111, for platform slots that force a dark mono mark.

SVG PNG 512 PNG 1024
Open Signal mark, white

Mark — white knockout

Solid #ffffff for teal, dark, and photographic grounds.

SVG PNG 512 PNG 1024

03 — Social profile kit

SlotFileSize
Profile picture — feed-sized slots (the default)relay-avatar-512.png512×512
Profile picture — with wordmark + ™, header-sizedrelay-avatar-lockup-512.png512×512
Avatar — X, LinkedIn tight cropsrelay-avatar-400.png400×400
Avatar — high-res slotsrelay-avatar-1024.png1024×1024
Link preview — og:image / twitter:imagerelay-social-og.png1200×630
App icon — stores, high-resapp-icon-teal-1024.png · light1024×1024
Faviconfavicon.svg · 32 · 64SVG · 32 · 64

The avatar tile is the only place the mark sits in a container — platforms demand one. Everywhere else the mark is unboxed. The wordmark never goes in an avatar; it will not survive the crop.

04 — Colour

Click a chip to copy the hex. Surfaces are true neutral — teal appears only on interactive elements and active states. #00D9C8 never appears in a static asset. Full ramp: relay-tokens-v36.css.

05 — Type

Cormorant Garamonddisplay · italic 300 · headlines only
OutfitUI + wordmark · 300–600 · wordmark is 600, −0.02em
JetBrains Monocaptions, Codes, labels · 400/500

06 — The rules that travel

Never a teal wordmark. Mark teal, wordmark ink — different colours by design. Never recolour either independently.
™ on first use only. Outfit upright superscript, inherits wordmark colour. Nav, body, and repeats stay bare RelayCTX.
Unboxed, flat. No container, shadow, gradient, or glow on the mark — avatar and app-icon tiles are the only exceptions.
Clear space = one mark-height. On all four sides of the lockup. Mark and wordmark scale as one object, never re-spaced.
Web uses the component. Inline SVG with currentColor from relay-lockup.html — files here are for everything that can't.
SVG is source of truth. Rasterise from it, never edit a PNG. Something renders wrong? Raise it against relay-creative — don't patch locally.