
Preview image. Unlock full-res
A layout-grid sizing page showing five stacked unit-box examples on the left and six A4 column-grid thumbnails on the right.
Summary
A grid-sizing reference: the left half stacks five "unit box" examples showing how base squares group into boxes, while the right half is a tidy 2x3 set of A4 column-grid thumbnails from 4 to 11 columns.
Visual description
Warm off-white background, thin top rule with "Visual Identity / System" kicker, "Layout grid" title, outlined "Sizing" subtitle and "127" at right. A short left copy column explains grouping squares into "boxes" with a bold "Note". The center-left shows five horizontal bands, each labelled (10, 8, 6, 5, 3 Unit box), with a solid near-black square at the start sized to that unit count and a faint grid extending right. The right third presents six small square thumbnails arranged 2 across by 3 down, each captioned with a column count and unit box ("4 Column layout grid / 10 Unit box" through "11 Column layout grid / 3 Unit box"), every thumbnail showing the same A4 frame filled with that column structure. Headings are bold; values are small.
Key takeaway
Pairing a sequence of solid "this is the unit" swatches with a thumbnail matrix of every resulting column count communicates a flexible grid system at a glance. The solid black box against a faint grid makes the unit size unmistakable.
Reuse notes
A strong layout for documenting a column or spacing system that supports many configurations. The thumbnail matrix scales to any number of presets. Dense but calm; works in a brand book or design-system deck. Keep captions consistent so the matrix stays scannable.
From this deck: F1 layout grid sizing
View deck




















































































































































































































