TranslateDesign / Design system
A shared visual language.
Warm surfaces. Clear typography. A little color where it counts.
Color & surfaces
canvas
#ffffff
surface
#ffffff
ink
#1a1a1a
muted
#605f5f
accent
#fef7af
peach
#fae5d8
mint
#def8f7
lilac
#f3d5f8
Type
Ideas need space.
Geist is the shared interface and body typeface. Display headings use medium weight and generous scale. Monospace is reserved for technical data.
Actions
Informational badge
Fields & feedback
Changes stay in this browser.
Check the dimensions before continuing.
Layout & accessibility
Mobile first. A 4px spacing rhythm; 12px fields, 24px cards and pill-shaped controls. Body text stays readable, fields use 16px text, actions are at least 44px tall and focus is visible. Pastel surfaces always use dark text. Layouts stack on narrow screens and preserve browser zoom. Reduced motion is respected.