Interactive studies of invisible design grids
Everything you see rests on an invisible set of decisions. Find one.
01 / CHANGE THE RULESCOLUMNS · GUTTERS · RHYTHM
02 / EDIT THE SELECTED PIECESELECT ANY PIECE
Click or tap a piece above to edit its content, color, size or placement.
03 / TAKE THE DESIGN WITH YOUSAVE · REOPEN · EXPORT
What is holding
this together?
Bring a screenshot, poster or page. Mark the edges you notice. Try a candidate grid against the image—and discover where alignment is intentional, accidental, or absent.
Choose an image, then click at least three vertical edges you think belong to a grid.
GUIDES ARE HYPOTHESES, NOT PROOF.Look at the space
between things.
A grid isn't a cage. It's a language for relationships. Explore, rearrange and break the rules—but learn to see the rules first.
Nothing requires a login. The original designs in this experimental study are free to manipulate. Saved projects, image inspection and SVG exports run locally in your browser.
A resource for
designers and learners.
Grid systems shape editorial typography, posters and modern interfaces. Columns, margins, gutters and baselines establish relationships; breaking them thoughtfully creates contrast and emphasis.
Continue exploring our grid-design articles and books on typography and grids. Historical articles, downloads and resources remain available during this site's renewal.