Spacing system

Spacing in a token-driven design system is a two-unit primitive problem, not a one-number guess. A token-driven system declares a minor unit (the smallest legal increment) and a major unit (the dominant rhythm), with the constraint that the major divides cleanly by the minor. Everything downstream — padding, gap, icon size, component height, border radius — derives from those two numbers.

When to use

• Designing a new spacing scale from a density brief.
• Auditing an existing scale with one-off off-grid values.
• Picking unit primitives for a density mode (dense / balanced / spacious).
• Code review: flag raw px values for padding / gap / margin outside the system's declared scale.

When NOT to use

• One-off marketing surfaces where the layout is hand-tuned and not part of the system's grid.
• Print-design contexts where the grid math is pt-based and a different system applies.

The two-unit primitive model

A token-driven system declares two unit primitives per foundation theme: