Type-Setting Reference
Every step of a modular type scale, joined end to end: size, recommended line-height, tracking, and the baseline grid it snaps to — the table a designer actually wants, computed live from the same functions this site’s calculators use.
2 steps down to 5 steps up, 16px base, major third ratio (1.25)
| Step | Size | Role | X-height | Line-height | Leading × | Tracking | Baseline grid |
|---|---|---|---|---|---|---|---|
| -2 | 10.24px | text | 5.32px | 13.82px | 1.35 | +40/1000em (+0.4096px) | 24px (1×24px) |
| -1 | 12.8px | text | 6.66px | 17.28px | 1.35 | +40/1000em (+0.512px) | 24px (1×24px) |
| Base | 16px | text | 8.32px | 21.6px | 1.35 | +10/1000em (+0.16px) | 24px (1×24px) |
| +1 | 20px | display | 10.4px | 24px | 1.2 | 0/1000em (0px) | 24px (1×24px) |
| +2 | 25px | display | 13px | 30px | 1.2 | 0/1000em (0px) | 24px (1×24px) |
| +3 | 31.25px | display | 16.25px | 37.5px | 1.2 | 0/1000em (0px) | 48px (2×24px) |
| +4 | 39.06px | display | 20.31px | 46.87px | 1.2 | -10/1000em (-0.3906px) | 48px (2×24px) |
| +5 | 48.83px | display | 25.39px | 58.6px | 1.2 | -10/1000em (-0.4883px) | 48px (2×24px) |
X-height assumes a 0.52 ratio (a typical mid-range typeface). Text-role steps (base and smaller) assume a 65-character paragraph measure; display-role steps (larger than base) assume a 25-character headline measure. Tracking is shown for normal case at a standard 96px-per-inch (4/3 px-per-pt) conversion — see the letter-spacing calculator for an all-caps value. The baseline unit is 24px throughout. Change any of these assumptions for your own project by running the individual calculators linked below with your own numbers.
How each column is derived
The step and sizecolumns come straight from the type-scale generator’s own geometric-progression formula: each step multiplies the base size by the chosen ratio, raised to the power of the step number. The roleis a simple split at the base size — step 0 and everything below it is treated as running text; everything above it is treated as display type, since that’s the size where the leading and tracking guidance genuinely change character.
X-height and line-heightcome from the x-height & line-spacing calculator’s computeXHeightSpacing(), using a fixed x-height ratio and a leading multiplier chosen by recommendLeadingMultiplier()from each role’s assumed measure. Trackingcomes from the letter-spacing calculator’s size-band guideline, converted into a pixel offset at that step’s actual size. The baseline grid column snaps each step’s recommended line-height to the nearest whole multiple of a shared baseline unit, using the same rounding logic as the baseline-grid calculator — never below one full unit, and rounded to whichever multiple the line-height is actually closer to, not always rounded up.
Every one of those calculations is a genuine function call made when this page renders, not a value typed once and left to go stale. A test alongside the code that generates this table asserts every rendered figure equals a fresh call to the same functions the calculators use.
Frequently Asked Questions
Where do these numbers come from?
Every column in this table is computed by the same functions the individual calculators on this site use — generateTypeScale() for the sizes, computeXHeightSpacing() and recommendLeadingMultiplier() for line-height, recommendTrackingPer1000() and convertTracking() for tracking, and snapToBaselineGrid() for the baseline placement. Nothing here is a separately hand-typed table, so it can't drift out of sync with the calculators.
Why does the leading multiplier change partway down the table?
Each step is treated as either a "text" role (the base size and everything smaller) or a "display" role (everything larger than the base). Text-role steps assume a comfortable paragraph measure and get a more generous leading multiplier; display-role steps assume a short headline measure and get a tighter one — the same size-dependent logic explained in this site's guide to choosing line spacing from x-height.
Why does tracking go negative at larger sizes?
Tracking follows the same optical-scaling guideline as the letter-spacing calculator: smaller text reads better with a touch more air between letters, and larger display type reads better tightened up, because the same proportional gap looks bigger in absolute terms the larger the type gets. A guide on this site works through the full size-band logic with worked examples.
What do I do with the baseline-grid columns?
The "snapped line-height" and "baseline multiple" columns show what each step's recommended line-height rounds to once it's locked to a shared 24px baseline unit — the same unit this site's baseline-grid calculator defaults to. Use the snapped value, not the raw recommended line-height, if you want every size in your hierarchy to stay in vertical rhythm with the others.
Reference table only — the assumptions above (x-height ratio, measure, baseline unit) are reasonable defaults, not universal constants. Run the individual calculators with your own typeface’s actual x-height and your own layout’s actual line length for a result tuned to your project.
Use it with
- Poster Type-Scale Generator — generate a scale at your own base size and ratio instead of the 16px / 1.25 default used here.
- X-Height & Line-Spacing Calculator— plug in your actual typeface’s x-height ratio and your actual measure, one size at a time.
- Letter-Spacing & Kerning Guide— convert a tracking value between units, and get an all-caps recommendation this table doesn’t show.
- Baseline Grid Calculator — snap a line-height to a baseline unit other than the 24px default used here, and check how many lines fit a page.