Metro Line Builder — Design System

Component library · 17 cards · v0.1

Brand

Colors

Brand Palette Transit Navy — 50 to 900
Ink Palette Neutral gray scale — 0 to 900
Line Colors Suggested palette for transit lines — vivid, distinct, accessible
Semantic Colors Success, Warning, Error, Info — backgrounds, text, borders

Spacing

Spacing Scale 4px base unit — token reference
Border Radius --radius-none through --radius-full
Shadows --shadow-xs through --shadow-xl

Type

Typefaces Barlow · Barlow Condensed · JetBrains Mono
Type Scale Barlow — xs through 5xl, weights 400–700

Components

Actions Button and IconButton variants, sizes, states
Display Badge, Tag, Card — variants and states
Feedback Toast, Tooltip, Dialog
Forms Input, Select, Checkbox, Toggle — all sizes and states
Metro Primitives LineIndicator, StationBadge, RouteTag — the transit-specific atoms

Map Editor

Map Editor Full metro map editor — canvas, toolbar, inspector panel