Page Grid Calculator
Columns, margins and baselines, drawn to scale.
Page
Margins (mm)
The grid
- Text area
- 175.00 × 252.00 mm
- Column width
- 55.000 mm
- Spread width
- 420.0 mm
- Type area
- 70.7% of the page
Baseline grid: 51 lines at 14pt
0.33pt left over at the foot. Set the text height to 251.88 mm for a clean fit.
Margins are named inside and outside rather than left and right because on a spread they swap sides. The inside margin is usually the smaller of the two on a single page and needs adding to for the binding on anything thick.
Set a page size, margins, columns and a gutter, and get the column width, the text area and a scale drawing of the result. It also checks whether your text height divides cleanly by your leading, which is the thing that quietly ruins a baseline grid three spreads in.
Why use this tool?
Drawn to scale
An SVG of the actual page with margins and columns, so a bad measure is visible before you open the layout application.
Baseline check
Tells you whether the text height is an exact multiple of the leading, and what height would be.
Van de Graaf canon
One button applies the classical 2:3 page construction, for when you want a starting point with some history behind it.
Any unit
Millimetres, picas, points or inches — whichever your job is specified in.
How this page grid calculator works
All arithmetic runs in points and converts at the edges. Working in the display unit is what produces the half-point drift you find in the last column — small enough to miss on screen and obvious in print. Converting once at the end keeps the columns reconstructing exactly to the text width.
The baseline check is the part most grid calculators leave out. A baseline grid only works if the text height is an exact multiple of the leading; otherwise the remainder accumulates and the last line sits progressively further off grid on each spread. The tool reports the leftover and the nearest height that divides cleanly.
The Van de Graaf canon is included because it is a genuinely good starting point rather than a curiosity. It constructs the text block from the page diagonals, producing margins in a 2:3:4:6 relationship — inside smallest, then top, then outside, then bottom. It is where traditional book proportions come from, and it still looks right on a screen.
How to use it
Step 1: Choose a page size
ISO, US or custom, portrait or landscape.
Step 2: Set margins and columns
Inside and outside rather than left and right, because on a spread they swap.
Step 3: Check the baseline
Adjust the text height until the leading divides evenly.
Example usage
- A book page
- A5 with canon margins as a starting point, adjusted for the binding allowance a thick spine needs.
- A magazine spread
- Three columns with a wide gutter, checked against a 14pt baseline so text aligns across the fold.
- A report template
- Letter portrait, two columns, with the text height tuned until the leading divides exactly.
Print grids and screen grids are not the same problem
A print grid solves a fixed problem. The page is a known size, it will never be another size, and the designer controls exactly where everything falls. A screen grid solves a moving one: the same content has to work from a narrow phone to an ultrawide monitor, and the grid has to describe a range of outcomes rather than one.
That difference changes what the numbers mean. In print, a column width is a measurement. On screen it is usually a fraction — a twelfth of whatever the container turns out to be — with the real constraint applied as a maximum width on the text container, because the actual typographic requirement is the measure in characters, not the column in picas. A grid that stays twelve columns wide on a phone has not adapted; it has just become unreadable at a smaller size.
What does transfer cleanly is everything about proportion and rhythm. Margins in a considered relationship, a consistent gutter, a spacing scale derived from the type rather than from round numbers, and the discipline of deciding these once — all of that is as useful on screen as on paper. The Van de Graaf canon will not survive a responsive breakpoint, but the habit of thinking about the text block as a shape on a field will.
Frequently asked questions
Why inside and outside rather than left and right?
Because on facing pages they swap sides. What is the left margin on a right-hand page is the right margin on the next. Inside and outside is the only unambiguous way to describe a spread.
What is the Van de Graaf canon?
A classical construction that places the text block on a page using diagonals, producing margins in a 2:3:4:6 relationship. It is where the traditional book page proportions come from, and it still looks right.
Why does my baseline grid drift?
Almost always because the text height is not an exact multiple of the leading. The remainder accumulates, and by the third spread the last line sits visibly off. This tool reports the remainder and the nearest clean height.
How do print grids translate to the web?
The proportions transfer; the measurements do not. On screen a column is usually a fraction of a fluid container rather than a fixed width, and the real constraint is a maximum width on the text so the measure stays readable. Keep the margin relationships and the spacing rhythm, and let the column widths become relative.
What gutter width should I use?
A common starting point is one to two times the leading, which ties the horizontal rhythm to the vertical one. The functional requirement is only that the gutter be unmistakably wider than the word spacing, so the eye never reads across the gap — narrow gutters on wide columns are how two columns start being read as one line.
Do I need a baseline grid on the web?
Rarely, and it is difficult to maintain, because images, embeds and variable content all disturb it. A more practical equivalent is a consistent vertical spacing scale built from multiples of the base leading, which delivers most of the visual benefit without needing every element to land on a rule.
Related tools
Copyfitting Calculator
How deep your copy runs, and whether the measure works.
Special Character Reference
Seventy characters, and when to use each.
Colour Converter
Every format for one colour, including OKLCH.
Browse every tool in Layout & Measurement Tools.