typeset

Audit font choices, hierarchy, scale, and readability, then replace invisible defaults like Inter or Roboto with fonts matching the brand. Establish a modular type scale with a consistent ratio and define clear weight roles for each text level.

Use a consistent ratio such as 1.25, 1.333, or 1.5 between levels, with about five sizes covering caption through heading. Combine size with weight, color, and spacing so hierarchy does not rely on size alone.

Use a fixed rem-based type scale for app UIs, optionally adjusted at one or two breakpoints, since fluid sizing undermines spatial predictability in dense layouts. Reserve fluid clamp() sizing for headings on marketing and content pages.

Use font-display: swap with metric-matched fallback fonts so text renders immediately without shifting when the web font arrives. Load only the weights you actually use, since each additional weight increases page load time.

Body text should be at least 16px or 1rem, set in rem units rather than px to respect user settings. Pair it with a line-height of 1.5-1.7 and a max-width around 65ch for comfortable long-form reading.