Requirement
Product UI is set in the product's declared display typeface and its declared body/UI typeface, at the declared weights. No other typeface — with one registered exception: a product's brand wordmark may use its own settled wordmark typeface, confined to the wordmark/logo lockup (the product name / masthead mark), never for running display, headings, or body text.
This is the typographic analogue of COL-1's per-product primary colour: a wordmark is
a brand asset (cf. IDN-1 for logo images), and a settled wordmark typeface is
registered in the product's DESIGN.md rather than re-flagged as a violation on every surface that renders
the mark.
Where the values come from
The product's DESIGN.md declares the typefaces and weights. Where it declares none,
the codebase's own font tokens (for example, --font-display and --font-body) decide.
Where neither does, Tailwind's default font stacks apply. This site's DESIGN.md, for
example, declares Plus Jakarta Sans (600) for display and Inter (400/500/600) for body
and UI text.
Per-product registered brand wordmark
Each product registers its settled wordmark typeface, if it has one, in its
DESIGN.md: the typeface, the token that carries it (for example, --font-logo), and
the lockup it is confined to. A product with no separate wordmark face sets its mark in
its display typeface.
A typeface not registered this way, or the registered wordmark face used outside its lockup (as heading or body type), is a TYP-1 finding.
Rationale
In a product pilot, a deliberate wordmark lockup set in its own typeface was flagged by TYP-1 as written ("no other typefaces") as a hard L1 violation, requiring a hand-written waiver on every surface that renders the mark. COL-1 already registers each product's primary colour; IDN-1 protects logo images; TYP-1 had no analogue for a wordmark typeface. Registering the settled wordmark face, scoped to the lockup, stops the recurring waiver while keeping the "no other typeface in running UI" rule intact.
Note the failure mode this does not excuse: a dead font @import (a typeface
loaded but used by nothing — for example, a shipped-but-unused Geist import) is still a
TYP-1 finding. The exception covers a used wordmark face, not loaded dead bytes.
How to verify
Script (literal families only): checks/type-scan reads each resolvable literal
family, in a CSS font-family or a Tailwind font-[…] value, and flags a primary
family that is not on its fixed list. The list holds Plus Jakarta Sans, Inter, the
font-token names (font-display, font-body, font-sans, --font-display,
--font-body), and common sans fallbacks such as system-ui, Helvetica, and Arial.
The script also flags the font-serif and font-mono utilities. The list is fixed in
the script and does not come from DESIGN.md. A face your DESIGN.md declares can
still be flagged by its literal name, so check such a finding against DESIGN.md
before you report it. A face on the list passes the script even when your product does
not declare it.
Evaluator (no script coverage): check each of these by hand.
- Literal families, flagged or accepted. Check every literal primary family against
the product's typefaces: the ones
DESIGN.mddeclares, else the codebase's font tokens, else Tailwind's default stacks. This includes every family the script accepts. A literalfont-family: "Inter"in a product whoseDESIGN.mddeclares a different face is a finding, although the script passes it. - Token-to-family mappings. The script passes any
var(--…)family without resolving it. Confirm each font token resolves to a faceDESIGN.mddeclares, or, where it declares none, to the codebase's font tokens or Tailwind's default stacks. - Weights. The script does not check weights. Confirm each face is used only at
the weights
DESIGN.mddeclares. - Wordmark registration and scope. Confirm a wordmark face is registered in
DESIGN.md, and that it appears only in the wordmark/logo lockup, not in headings or body. Wordmark-in-lockup passes; wordmark-as-heading is a finding. - Unused imports. The script does not read imports. Confirm every face the product
loads (
@import,@font-face, or a font package) is used.