Base unit: 0.25rem (4px)
| Visual | CSS Variable | Value | Use Case |
|---|---|---|---|
--spacing-xs |
0.25rem (4px) | Extra tight, icon spacing | |
--spacing-sm |
0.5rem (8px) | Compact, button padding | |
--spacing-md |
1rem (16px) | Standard spacing, padding | |
--spacing-lg |
1.5rem (24px) | Component gaps, margins | |
--spacing-xl |
2rem (32px) | Section spacing | |
--spacing-2xl |
3rem (48px) | Large section gaps |