Skip to main content
Substrate has no named type-size tokens — no xs/sm/md ladder. Font size is a continuous function: a base size raised to a power of a computed ratio, where the exponent comes from the element’s text role and the ratio itself responds to the user’s typeScaleFactor preference at runtime.

​
The computed scale

The root of the system is one expression, from generated/global/css/tokens.gen.css:
  • --scale-ratio is the brand’s modular ratio (typography.scale-ratio; the demo brands ship values from 1.2 to 1.25).
  • --type-scale-factor is the user’s continuous type-scale preference (0.9 → 1.4, default 1).
Each surface then computes its size — this is real generated component CSS:
--font-size-base comes from typography.base-font-size — a rem number (every bundled demo brand uses 1). Sizes are quantized to --font-size-quantum (0.25rem) so computed values land on a tidy grid.

​
Text roles

The exponent (--_font-scale) comes from semantic text roles, not size names. The shipped roles and their fractional exponents: Fractional exponents are the point: a discrete integer ladder could never express caption at −0.75 steps. Roles also carry role-specific APCA foregrounds (--ucs-{intent}-fg-l-{role}) because contrast targets depend on rendered size and weight.

​
Font families

Three stacks, from typography.heading-family, body-family, and optional mono-family: There is no --font-sans and no font: config block.

​
Density and contrast coupling

Typography participates in the continuous system twice more:
  • typography.density supplies font-size-k and font-weight-k coefficients so type can respond to the user’s density preference.
  • --weight-bump adds font weight when --contrast-factor climbs past 1.2 — high-contrast users get sturdier strokes, not just darker ink:

​
Fluid typography

Per-brand fluid behavior lives in typography.fluid (rate, optional floor, ceiling, quantum), with per-role envelopes in the generated text-role metrics. There is no top-level viewport config block.

Config: Typography

How to author the typography section of a brand config.