Spacing, radii & shadows

Linear 4px scale named not numeric — use the tokens, not raw px. Radii fixed at 8/10/12/pill. Shadows are reserved for floating surfaces; data cards use hairline borders instead.

Spacing scale

--spacing-xs

2px

--spacing-sm

4px

--spacing-md

8px

--spacing-lg

12px

--spacing-xl

16px

--spacing-2xl

20px

--spacing-3xl

24px

--spacing-4xl

32px

--spacing-5xl

40px

--spacing-6xl

48px

--spacing-7xl

64px

--spacing-8xl

80px

--spacing-9xl

96px

Radii

xs

4px

sm

6px

md

8px · default

lg

10px · nav

xl

12px · cards

2xl

16px

pill

∞ · chips

Shadows

shadow-xs

inputs · raised tile

shadow-sm

popovers · dropdowns

shadow-md

cards on hover

shadow-lg

modals

shadow-xl

command palette

shadow-2xl

marketing hero