Design Language
FORK
v1.0 · Mar 2026
Explore
Colors
Backgrounds, labels, fills, separators, system colors, tint alternatives, grays, semantic tokens, on-colors
9 sections
Layout
Shadows, spacing scale, radius tokens, concentric corner radius formula
3 sections
Components
Buttons, inputs, switches, avatars, badges, tabs, lists, cards, modals, skeletons
12 sections
Messages
Chat bubbles and terminal output — input, rich content, agent patterns, and session flows compared side by side
18 sections
Typography
Display / Besley, body / Figtree, mono / IBM Plex — full type scale with cross-platform specs
3 sections
Visual Direction
Liquid Glass effects, frosted fallbacks, glass + dot interaction, PlanarKit dot pattern
3 sections
Motion
Spring presets, CSS equivalents, press/release asymmetry, rubber banding, dot effects
2 sections
Reference
Complete token table with live-resolved values, click to copy
All tokens
FORK draws from Braun's reduction, Apple's material honesty, Teenage Engineering's precision, and industrial tactility. Warm neutrals instead of pure black. Springs instead of linear easing. Semantic color only — nothing decorative. Three type families with strict roles: Besley commands, Figtree recedes, Mono labels. Glass refracts, shadows follow light, whitespace signals confidence. Every token works at 320pt under a thumb. Every element earns its place.