Skip to main content
Typography is the second standard section. It contains the brand’s type system: typefaces, licensed weights, the hierarchy that turns type into a working system, web stacks and fallbacks, print specifications, and the licence terms so the team always knows what is paid for.

​
What lives here

A complete Typography section has six block groups:
  1. The typefaces. Each typeface used by the brand, with its name, foundry, and a specimen. Web and print typefaces both included.
  2. The licensed weights. Which weights of each typeface the brand has licensed for which use (web, desktop, app, broadcast). Unlicensed weights are flagged as such and the team is told not to use them.
  3. The hierarchy. How type works in combination. H1 through micro-copy, with size, weight, line-height, letter-spacing, and example specimens. Includes responsive rules where relevant.
  4. Web stacks and fallbacks. The CSS font-family declarations the team’s developers should use. Includes system-font fallbacks for performance.
  5. Print specifications. The settings the print partners need: typeface, weight, size, leading, tracking, alignment, optical sizing where relevant.
  6. Licence details. The licence holder, the seats covered, the renewal date, and the contact at the foundry. A summary is fine; the full licence lives in the asset bundle.

​
Who edits this section

The brand owner. Editors with Typography edit rights. MadeBy_ during a maintenance or evolution engagement. Team members typically do not edit; they raise Update Requests when a new weight is needed for a use case, when a fallback fails on a customer device, or when a print partner asks for a specification not currently documented.

​
What team members see

Team members see live web type rendered in the section: every typeface displays in its actual form, so what they see is what the brand looks like. Print specifications are listed in a table for easy copy. Web stacks are presented as code blocks that copy to the clipboard with one click.

​
How this section changes

Typography changes for three reasons:
  1. A new weight is licensed. The licensed weight set expands, and the documentation needs to catch up. The brand owner adds the weight; the team is notified.
  2. A licence renews or lapses. Renewals are recorded; lapses trigger a fallback plan and a warning to the team. This is one of the categories worth automating a calendar reminder for.
  3. A typeface is replaced. Larger work, usually part of a brand evolution project. The old typeface is moved to the section’s history; the new one becomes canonical. The team is notified explicitly because they will need to update their templates.

​
Common mistakes

Five mistakes show up repeatedly in Typography sections:
  1. Licensed weights not specified. The section lists “Inter” without specifying which weights are licensed. The team uses Inter Black and the licence does not cover it. Specify every licensed weight.
  2. No web fallback. The section lists the typeface for desktop use but does not give the web team a CSS font-family with fallbacks. The site loads the wrong font for two seconds on every page.
  3. Hierarchy without example. A table specifies H1 as 48px/56px Bold but no specimen is shown. The team has to render it themselves to know what it looks like. Show the specimen.
  4. Print specifications missing. The web hierarchy is documented and the print partner is left to interpret. Print partners interpret consistently wrongly. Specify print explicitly.
  5. No record of the licence terms. The team licences a typeface; two years later no-one remembers what the licence covers. Record the seats, the use cases covered, and the renewal contact.

Logo & Identity

The first section.

Colour System

The third section.

Applications

Type in context.