Skip to content
UX Atlas
Plate FND·007 · UI foundationGrid C2 · Rev. 2026-08-14

Closure

The eye completes incomplete shapes, which is why a partially visible item signals that there is more.

UI foundationEstablished researchIntermediate

Definition

A Gestalt principle describing the tendency to perceive incomplete figures as whole. The visual system fills gaps to produce a recognisable form.

Established research. Originates in published research and has been replicated. The effect is real. Its size in your product still needs measuring.

On this plate
  1. 1Definition
  2. 2Interface uses
  3. 3Where implied shape does real work
  4. 4In practice
  5. 5Local chart
  6. 6Sources
  7. 7Continue from here

Reach for this when

  • Designing horizontal scrollers and carousels.
  • Indicating that content continues beyond the fold.
  • Simplifying icons for small sizes.
  • Content continues beyond the visible area and nothing on screen says so.

Common mistakes

  • Relying on closure as the only signal that content continues.
  • Truncation that hides the informative part of a string.

Interface uses

  • Cutting off a card at the edge of a horizontal scroller signals that the row continues. A row that ends flush at the viewport edge reads as complete, and users do not scroll it.
  • Truncated text with a fade or ellipsis implies continuation, though an explicit control is more reliable.
  • Loading skeletons work partly through closure: the shapes imply the content that will fill them.
  • Logos and icons can omit strokes and still read, which is what allows simplification at small sizes.

Where implied shape does real work

In each case the reader completes something the interface only partly draws, which saves ink without losing meaning.

  • A partially visible next item, which implies a scrollable row continues.
  • A progress ring that reads as a circle at any percentage.
  • A cropped photograph, understood as a whole scene.
  • An input group bounded on three sides, still read as one field.
  • A truncated list with a count, understood as a longer list.

In practice

  1. i.

    Peeking cards in a carousel

    Mobile listings

    Showing a sliver of the next card raises horizontal scroll engagement substantially compared with a row that ends at the viewport edge.

  2. ii.

    The row that looked complete

    When closure is not offered

    A horizontally scrolling row whose last visible card ended exactly at the container edge read as the end of the list. Letting the next card peek by twenty pixels was the entire fix.

Local chart

FND·007 · Region II · Grid C2

This entry and the entries it is stated to connect with. Each line is labelled with what the connection means.

CarouselCMP·027 · APPLIED THROUGHSkeleton ScreensPAT·012 · APPLIED THROUGHLaw of PrägnanzLAW·017 · PRINCIPLES BEHIND THISDiscoverabilityPRIN·005 · PRINCIPLES BEHIND THISMobile UX ChecklistCHK·003 · CHECK YOUR WORKContinuityFND·008 · RELATED CONCEPTIconographyFND·050 · RELATED CONCEPT

Sources

Where a source establishes something narrower than the popular reading of it, the note says so.

  1. [1]

    Principles of Gestalt Psychology

    K. Koffka, Harcourt Brace, 1935

Continue from here

Each link says what the connection is, so you can tell a principle from an alternative from a thing people mix this up with.

Applied through

Where this shows up as a concrete interface decision.

Principles behind this

The reasoning this solution is an application of.

Check your work

Review passes that test whether this was done properly.

Related concept

Connected closely enough to change how you apply this.