Perception & Gestalt
Law of Proximity
Objects near each other are perceived as more related than objects farther apart.
Mechanism
Why it happens
The visual system groups by spatial distance before it reads labels or colour; proximity is processed pre-attentively.
Impact
Why it matters
- Uniform spacing everywhere means nothing reads as grouped
- Proximity alone can communicate structure without any borders or colour at all
- Mis-set spacing is a leading cause of forms that feel harder to fill in than they are
Example
Without vs. with
Name
Every field and every field group sits 16px apart, so nothing reads as related.
Name
8px between a label and its field, 24px between fields, 48px between sections.
Checklist
How to apply it
Use tighter spacing within a related group and looser spacing between groups
Put a form label closer to its own field than to the field above it
Don't rely on colour or borders alone to show grouping. Proximity should already say it
Keep a spacing scale: label-to-field < field-to-field < group-to-group < section-to-section
Where it shows up