Base grid 12pt square

Summary

The base-grid definition page: a cream slide that explains F1's 12pt square base unit in a left text column, with a large faint grid field filling the right side and a single red square in the top-left corner of that field called out by a leader line.

Visual description

Warm cream background with the standard top hairline ("Visual Identity / System", headline "Base grid", page "123"). The left column holds layered body copy explaining that everything starts with a square: the 12pt square base unit, equal to 1 pica (1p0) in print and 12px on screen, with a "Why is our base grid so important?" note beneath. A thin leader line runs from the text out to the grid. The right two-thirds is a large faint square-ruled grid field that bleeds off the bottom and right edges; a single solid red square sits in its top-left cell, marking the one base unit against the many. A second small red square punctuates the end of the left text block.

Key takeaway

Defining the whole grid system by isolating one red unit cell inside a field of identical faint cells, so the abstract "12pt square" is shown as a literal object you can point to. Giving the same measurement in pica and pixels makes the rule usable in both print and screen work. The leader line tying copy to the marked cell is a clean way to connect explanation to demonstration.

Reuse notes

A foundational template for the grid or layout section of any guideline that builds from a base unit. The single-highlighted-cell device reads instantly and scales to any module size. Stating the unit in multiple measurement systems is a practical touch worth keeping. Pairs directly with the larger modular-grid pages that follow.