hueRelay
Swiss transit board system.
Relay is a Swiss transit dispatch platform on a pure white canvas: hairline black borders, one signal red, zero radius anywhere. The hero is the swiss-precision preset: a live departure board sitting flat on a 48px grid, ruled like a station hall. Inter at weight 800 with tabular numerals does the announcing; nothing is rounded, nothing decorative, nothing late. Among the light brands it is the strict one: atlas charts, ledger prints, relay dispatches.
On time, on grid. Relay is the dispatch and timetable platform for operations teams. The identity is borrowed straight from a station hall: a hairline grid, a black header strip, tabular numerals, and one red square that says 'this is moving'. Nothing is rounded, nothing decorative, nothing late.
Anatomy
Fictional Swiss transit dispatch and timetable platform. Pure white canvas, hairline black borders, one red accent, zero radius anywhere. The hero is a live departure board sitting on a 48px grid. Proves the swiss-precision preset: medium: grid + subject: ui-board + relation: flat-on-rule. Inter 800 doing all the typographic heavy lifting.
Hero composition
pure white canvas with a faint 48px hairline grid (#E0E0E0). A 'DEP 14:00 GLEIS 3 ON TIME' eyebrow with a red square dot sits above an Inter 800 headline at clamp(56px, 7.5vw, 128px), letter-spacing -0.035em, line-height 0.94. Below it, a live departure board: black header strip with white mono caps, four tabular rows showing time, destination, service, track, status. Three rows are ON TIME, one is +2 MIN in red. The board has 1px black borders all the way through. Zero border-radius, zero gradients, zero shadows.
Color tokens
| Token | Value (light) |
|---|---|
| background | #FFFFFF |
| surface1 | #F2F2F2 |
| surface2 | #E6E6E6 |
| surface3 | #E6E6E6 |
| border | #000000 |
| border_visible | #000000 |
| grid | #E0E0E0 |
| text1 | #000000 |
| text2 | #595959 |
| text3 | #595959 |
| text4 | #595959 |
| accent | #DD0000 |
| accent_hover | #000000 |
| on_accent | #FFFFFF |
Typography tokens
| Role | Family | Size |
|---|---|---|
| display | Inter | 128px |
| body | Inter | 16px |
| mono | JetBrains Mono | 13px |
Voice
- The schedule, on time.
- Departures, arrivals, platforms, connections. One service. No detours.
- Every departure, accounted for.
- Real-time data. Plain JSON.
- Board the relay. One service, on time.
Live preview
Generate one like this
hue is a free, open-source skill that turns any brand into a complete design language your AI assistant can use.