Gestalt: common region

What is the Gestalt law of common region?

Common region is the grouping you get from a shared boundary: put a line or a tinted background around some items and they read as a set - even when other items sit just as close, or closer.

Also known as: law of common region, common region principle, enclosure

The demo

Six dots in a row, evenly spaced. Draw a box around each pair and watch one row become three pairs - without a single dot moving.

One even row of six - the spacing gives no reason to group them either way.

What this demo shows (text version)

Six dots sit in a single row, equally spaced, so nothing about their distance suggests any particular grouping - you read one row of six.

Switching on "draw regions" places a tinted, rounded box around each adjacent pair. Immediately the row reads as three pairs, even though no dot has moved and the spacing is exactly as it was. The shared boundary does the grouping, overriding distance entirely - that is the Gestalt law of common region.

The dots never moved, but the moment a box was drawn around a pair, they became a unit - and the neighbour just outside the line, no further away than before, was suddenly an outsider. Enclosure quietly overrules plain distance.

Common region is the workhorse of interface grouping: cards, fieldsets, tinted callouts, the zebra-striping of a table. It is how you say "these belong together" without leaning on spacing alone, and it can bind items that proximity never could.

Because enclosure is so strong, a stray border or background does real damage - bundling things that are unrelated, or splitting a set that belongs together. Draw regions deliberately: every box you add is a claim that the things inside it go together.