03
Spacing
Consistent spacing scale based on a 4px grid. Click any row to copy the token name.
| Token | Value | Pixels | Example |
|---|---|---|---|
| spacing-0 | 0rem | 0px | |
| spacing-1 | 0.25rem | 4px | |
| spacing-2 | 0.5rem | 8px | |
| spacing-3 | 0.75rem | 12px | |
| spacing-4 | 1rem | 16px | |
| spacing-5 | 1.25rem | 20px | |
| spacing-6 | 1.5rem | 24px | |
| spacing-8 | 2rem | 32px | |
| spacing-10 | 2.5rem | 40px | |
| spacing-12 | 3rem | 48px | |
| spacing-16 | 4rem | 64px | |
| spacing-20 | 5rem | 80px | |
| spacing-24 | 6rem | 96px | |
| spacing-0.5 | 0.125rem | 2px | |
| spacing-1.5 | 0.375rem | 6px | |
| spacing-2.5 | 0.625rem | 10px | |
| spacing-3.5 | 0.875rem | 14px |