/
Browse all pages

Fonts

Every font stack on the page, what it is drawn in, and where it falls back or fakes bold.

These cards are in the Design tab. Hover a row to outline its element on the page, and click it to select it, which fills the Element tab.

Fonts lists every font stack the page sets text in (each font-family value), with what it is really drawn in, the weights asked of it and how many elements use it. Stacks with a problem come first:

  • Not loaded: the first family did not load, so the text falls back to the next one. The stack under the name strikes out what was skipped.
  • Bold faked: bold was asked of a web font that has no bold face, so the browser thickens the regular one. Italic is faked the same way, by slanting.

Hover a row to outline an element set in it, click it to select it. For one element, the Warnings section of the Element tab shows its whole stack and the face drawn; see Warnings.

Faces are known for web fonts, the ones a page loads with @font-face. A font installed on the computer cannot be asked for its faces, so faked bold is not checked for it. A web font still downloading reads as not loaded until it arrives.

Questions

Can it tell faked bold for a font installed on my computer?

No. A page cannot ask an installed font for its faces, so faked bold and italic are checked for web fonts only.