No. 016·noun·also called layout grid, columns, grid system

Grid

An invisible set of columns that everything on the page lines up to, so it looks orderly instead of scattered.

SPECIMEN · LIVE DEMO
Definition

What it is

A grid divides the page into columns (often 12 on desktop) with consistent gaps between them. Content snaps to those columns, which is why well-designed pages feel tidy even when they hold a lot.

You'll also hear "grid" for a layout of equal items in rows and columns, like a product grid. Both meanings share the idea: consistent columns, consistent gaps.

When asking for one, say how many columns at each screen size and how big the gaps are. "3 columns on desktop, 2 on tablet, 1 on phones" is precise.

Say it like a builder

How to ask for it

Vague

“The products are all over the place. Line them up better.”

Precise

“Lay out the products in a grid: 4 columns on desktop, 2 on tablet, 1 on phones, with 24px gaps. Every card in a row should be the same height.”

Why it works

"Line them up better" has no target; "grid" with column counts per screen size and a gap value is something a builder can match exactly.

In the wild

You've seen this in

  • EProduct listings on Etsy
  • DDribbble's shot gallery
  • AApple's product comparison pages
Usage note

Often confused with