Spacing consistency is more important than perfect spacing everywhere.
I use a simple 4px base unit:
- 4px (tiny)
- 8px (small)
- 12px (medium-small)
- 16px (medium)
- 24px (medium-large)
- 32px (large)
- 48px (extra-large)
- 64px (massive)
This works because:
- It's divisible by 2, 3, 4, and 6
- It scales naturally with most font sizes
- It's easy to remember and communicate
- It works well with CSS custom properties
The key is to stick to your scale. Even if a design calls for 19px, round to 24px. Consistency wins over pixel-perfection.
