Shop. Floating shopping constellation on white marble.
- Commerce
- Light theme
- 11 colors
- 2 typefaces
Shop runs on a white-canvas discovery model where products float as large, heavily-rounded image cards instead of grid-locked thumbnails. The entire interface is pillow-soft: 20–28px radii everywhere, pill-shaped controls, a compact 16px GT Standard body with tight negative tracking that pulls text into crisp shapes. A single vivid violet (#5433eb) is the system's only saturated accent — it appears in the wordmark, the circular search submit, and as a tinted shadow on that same button. The rest of the palette is warm-neutral: white surfaces, a faint cool-gray canvas, hairline borders, and near-black text. Density stays compact with 12px gaps, but the hero and category bands breathe through generous 64–80px vertical rhythm, making commerce feel browsable rather than catalog-like.

Shop design system
Brand2
Search submit button, wordmark dot, brand logo — the single accent that makes action and identity pop against the white canvas
Translucent halo behind the violet submit button, extending its glow without changing hue
Neutrals9
Primary text, headings, icons, nav symbols, and dark mode product cards
Dark product card surfaces and deep-tone overlay text
Warm desaturated gray used in product imagery backdrops, not an active UI token
Secondary text, navigation labels, icon strokes in idle state
Subtle surface tints for secondary product cards and section backgrounds
Placeholder fills, disabled states, and inactive icon backgrounds
Hairline dividers on cards, input outlines, and pill button borders
Page background and secondary surface wash behind elevated cards
Primary surface for cards, input fields, floating brand spotlights, and pill buttons
Try a pairing
Pick any two colors from the palette to check whether text stays readable on top.
Aa
Pure White on Shop Violet
6.88 : 1 contrast
- Body textPasses AA 4.5
- Large textPasses AA 3
- StrictFails AAA 7











