Layout & Grid Systems

Summary

Using a consistent grid (columns, gutters, margins) to align and space elements predictably — grids are largely invisible when done well, but their absence makes a layout feel randomly arranged.

• 1Set up a basic 12-column grid in Figma and align a sample layout to it.
• 2Study a well-designed website's grid structure using a grid-overlay browser extension.
• 3Learn why consistent gutters and margins matter as much as the column count itself.