Design Principle
Spacing should express structural relationships, not item-by-item guesswork.
Principle
Spacing should express structural relationships, not item-by-item guesswork.
Design action
Use limited spacing tokens; adjacent, intra-group, inter-group, and section spacing should increase, with stable dimensions for toolbars and grids.
Examples
Positive example: Cards, forms, tables, and toolbars need unification. Counterexample: Many random margin values.
Apply when
Cards, forms, tables, and toolbars need unification. Dense pages still need clarity.
Source notes
Source note: Synthesized from Apple HIG, Material Design, NN/g usability principles, and layout/hierarchy practices in mature design systems. Apple HIG Layout: https://developer.apple.com/design/human-interface-guidelines/layout Material Design Layout: https://m3.material.io/foundations/layout/applying-layout NN/g Visual Design Principles: https://www.nngroup.com/articles/principles-visual-design/
Agent Directive
Use limited spacing tokens; adjacent, intra-group, inter-group, and section spacing should increase, with stable dimensions for toolbars and grids.