Gestalt Principles in Design: The 7 Laws with Examples
Gestalt principles explain how the eye groups elements into a whole. Here are the seven laws and how to use each one in real interface design.
Shaheer Malik
Framer Designer & Developer
Gestalt principles are a set of rules from psychology that describe how people naturally perceive grouped visual elements as a single, organised whole rather than separate parts. In design they explain why we see related items as belonging together, and they are the foundation of clear layout, grouping, and visual structure.
What are the Gestalt principles?
The Gestalt principles come from a school of German psychology founded in the 1920s by Max Wertheimer, Kurt Koffka, and Wolfgang Köhler. The core idea is captured in the phrase "the whole is other than the sum of its parts": our brains automatically organise what we see into patterns and groups.
For designers, that is enormously useful. It means you can use predictable perceptual rules to make an interface feel organised and intuitive, so users understand what belongs with what before they read a single label.
The 7 Gestalt principles, with UI examples
| Principle | What it says | In a UI |
|---|---|---|
| Proximity | Things close together are seen as a group | A label and its input field; cards in a grid |
| Similarity | Things that look alike are seen as related | All primary buttons share one color and shape |
| Closure | The eye completes incomplete shapes | Icons drawn with gaps still read as whole |
| Continuity | The eye follows lines and curves | A row of items reads as one sequence |
| Figure-ground | We separate an object from its background | A modal sits above a dimmed page |
| Common region | Items inside a boundary feel grouped | A card or panel groups its contents |
| Connectedness | Linked items feel most strongly related | A line or stepper connecting steps |
Why Gestalt principles matter in design
They matter because they let you group and separate information without extra labels or lines, which keeps interfaces clean. Since people scan rather than read, Nielsen Norman Group eye-tracking work shows users rely heavily on visual grouping to make sense of a page quickly, often reading only a fraction of the actual text.
Used well, Gestalt principles reduce cognitive load: the structure does the explaining. Used badly, or ignored, even good content feels cluttered and confusing.
"Good design is invisible. People do not notice the hierarchy, the spacing, or the color logic. They just feel like the product makes sense, and that feeling is the entire job."
Shaheer Malik, senior UI/UX designer and Framer developer (75+ projects shipped, rated 4.93 stars across 32 Contra reviews)
How to use Gestalt principles in practice
- Group with space, not lines. Proximity alone usually communicates grouping, so you can remove dividers and reduce clutter.
- Make related actions look alike. Similarity tells users which buttons do similar things.
- Use containers deliberately. Common region (a card or panel) is a strong, clean way to group content.
- Respect figure-ground. Keep enough contrast between foreground and background so the focus is obvious.
- Pair Gestalt with hierarchy. Grouping plus visual hierarchy is most of what makes a layout feel effortless.
Frequently asked questions
What are the Gestalt principles in simple terms?
They are rules describing how people automatically group what they see into organised wholes. In design, they explain why related elements feel like they belong together.
How many Gestalt principles are there?
The commonly used set in design is seven: proximity, similarity, closure, continuity, figure-ground, common region, and connectedness. Some lists include a few more.
Why are Gestalt principles important in UI design?
They let you group and separate information using space, similarity, and containers instead of extra labels or lines, which keeps interfaces clean and easy to scan.
What is the most useful Gestalt principle for designers?
Proximity is often the most powerful: simply placing related items close together, and unrelated items further apart, communicates structure with no extra elements.
Where do the Gestalt principles come from?
From a school of German psychology founded in the 1920s by Wertheimer, Koffka, and Köhler, studying how the mind organises perception.
Want this applied to your product?
I design and build UI/UX for SaaS and AI startups, design and development under one roof. See my UI/UX design services, browse case studies, or get a fixed quote within 24 hours.
Related reading
Need this kind of work for your product?
I design and build websites, products, and brands for SaaS & AI startups — design and code under one roof.