Type Hierarchy

A hierarchy is the distance between the sizes, not the sizes

A hierarchy is not a list of sizes. It is the distance between them.

Set a heading at 17 and body at 16 and you have not made a heading. You have made a paragraph somebody nudged. A reader scanning the page will not see two levels, because two levels only exist when the eye can tell them apart without measuring.

So this rule is not a set of sizes. Your sizes live in your type scale, and nothing here writes to them. This rule is two numbers about the relationship between them, and like the margin rule, it is stored as a relationship so that it holds however big the type gets.

The minimum ratio

How far apart two neighbouring levels have to be.

Anything above 1.01 and up to 4 is accepted. At or below 1 there is no hierarchy left to state, which is where the floor comes from.

Under the field, if your brand has more than one sized level, the form names the tightest pair you have today. That number is the most useful thing on the form: it is what your brand is already doing, measured.

Set the minimum above it and the product will report your own scale as breaking your own rule. That is useful information rather than a failure. It means one of two things: either the rule is more ambitious than your type, or two of your levels are doing the same job and one of them could go.

Both fields arrive empty and the save waits until you have answered both. There is no starting number to accept without reading it.

The ceiling on one surface

A ceiling, not a target. Three means no single page, card or slide sets text in more than three of your sizes. Nothing asks you to use three.

A page with six sizes on it reads as six decisions rather than one system, whatever the sizes are. That is the thing the ceiling is for. It takes a whole number from 1 to 12.

The two numbers work together, and they can fight. A shallow ratio with a high ceiling produces pages that look busy and undifferentiated at the same time, which is the worst of both: many sizes, none of them far enough apart to read as a decision.

Where your sizes come from

A level gets a size one of two ways, and neither of them is a guess.

If the level already carries a size of its own, that size wins, always. Somebody measured it or imported it from a real system, and arithmetic does not get to overrule a measurement.

Otherwise, if your brand has stated a base size and a ratio and confirmed them, every level you have placed on the ladder gets its size worked out from those two numbers, fresh, every time it is read. Move the base later and every level moves with it. That is the point of storing the rule rather than the answers: a size copied down once has no memory of what it was copied from. Nothing is ever written back onto your tokens.

A ratio nobody has confirmed does nothing at all. A proposal is inert until somebody agrees to it, and a ladder drawn from a fitted ratio would be your brand described in numbers you never accepted.

A level with neither is not on the ladder. It has a typeface and no size, so there is no distance between it and anything else, and inventing one from the order the levels happen to be listed in would be a number nobody decided. It shows as a gap instead.

If fewer than two of your levels have a size

Then there is no pair for the ratio to hold apart, so nothing can keep it and nothing can break it.

The product says so on the row rather than badging the rule as holding, because a rule that cannot be checked shown as fine is worse than no rule at all. An absence of findings would read as a rule that was evaluated and held.

It also changes what gets sent out. With no sized level at all, nothing about this rule reaches anyone: both halves of it are claims about your levels and there are none. With exactly one sized level, the ratio half drops and the ceiling half still stands, because a ceiling on how many levels appear at once is a real instruction even where there is only one to count.

The fix is either to give your typography its sizes directly, or to state a base and a ratio and confirm them. Both live under Type scale in Colors and fonts. The picture on the row says the same thing in its own words when there is nothing to draw.

What the product checks, and against what

Two different things, and they fail differently.

Your scale

Every neighbouring pair on your ladder is compared against your minimum. A pair that sits closer is marked in red in the picture, the row reports that the rule does not hold, and the finding names the two levels and the ratio between them. Your own type contradicts your own rule, and somebody obeying both cannot obey either.

The product changes nothing about it. It offers two directions, move a level or lower the rule to what the scale actually is, and leaves the choice to you.

Only neighbouring pairs are compared. A brand with a 48 and a 16 two rungs apart is not checked on that pair, and it does not need to be: the level between them already has to clear the minimum against each of them, so the wider pair clears it twice over.

A surface

Sidenote draws your brand through seven test layouts that put pressure on different parts of it, and counts how many distinct levels each one ends up using. A layout that uses more than your ceiling is reported by name, along with the levels it used. What is counted is distinct levels rather than pieces of text: a layout that sets three paragraphs at the same level has used one.

Worth being plain about: that is a statement about the layouts Sidenote tests with, not about work you have made. Nothing here opens your documents. If a test layout uses four of your sizes and your ceiling is three, what you have learned is that a page built to that shape cannot be made from your brand without breaking your own rule. That is usually worth knowing, and it is not a report on your files.

Reading the picture

The picture on the row draws three of your real levels in your real faces, with the ratio between each pair written in beside them.

It does not always start at the top of your ladder. If a pair fails, the window starts there. A brand with six levels and a problem between the fifth and the sixth would otherwise show three clean pairs and no sign of the finding at all.

A level larger than the picture can hold is drawn smaller and labelled at its real size, so the label says what the level actually is and the ratios stay the ratios. Scaling the whole ladder to fit would change every number the picture is about.

If you have nothing written down

Two decisions, and your own brand answers both of them if you let it.

For the ratio, start from the tightest pair the form names under the field. That is what your brand is already doing. If those two levels read as two levels to you, rule that number and your scale passes on the first day. If your headings do not read as headings, rule something above it on purpose and take the finding as the to-do list it is: it will name the exact pair to move.

For the ceiling, count the distinct sizes on the busiest page you have ever made and ask whether all of them earned their place. Whatever survives that count is your ceiling.

The other rules

Grid and margins sets out why every rule here is a relationship rather than a measurement. Clear space is the third rule on the card. The sizes themselves are edited under Type scale in Colors and fonts, and the faces each level uses show up again in brand components, where a card states which of them its heading and its body are set in.