A grid is a system of intersecting horizontal and vertical lines used to structure content on a page or screen. It divides the layout into columns, rows, and gutters, giving designers a consistent framework for placing text, images, and other elements.
‍
Grids come in different flavors, like column grids, modular grids, and baseline grids, each suited to different types of content. They help keep spacing and alignment predictable across a design.

Why does a grid matter?

A grid brings order and rhythm to a design, making layouts feel balanced and easier to scan. It speeds up the design process since you're not reinventing spacing and alignment decisions for every screen.

Grids also make it easier to build responsive designs, since columns can adapt or reflow across different screen sizes while keeping the overall structure consistent. Most design tools, like Figma or Sketch, let you overlay a grid directly on your artboards.

Similar