Search code examples
cssgoogle-chromefontsgoogle-chrome-devtoolsfont-face

Where does Chrome "Rendered Fonts" get the name of the font from?


In the Chrome Inspector, Computed Tab, at the bottom, it shows the actual fonts that are rendered, but for the site I am working on it says:

Rendered Fonts

.—Network resource(40 glyphs)

Whereas normally, it says something like this on other sites:

Rendered Fonts

Arial—Local file(158 glyphs)

Consolas—Local file(29 glyphs)

Menlo—Local file(1 glyph)

or this:

Rendered Fonts

Nunito—Network resource(49 glyphs)

Where is it getting the "name" . for my file?


Solution

  • Fonts have MetaData, it seems the creator of the font you are using did not properly fill it.

    You can try this website to check the metadata of your font to see if the name part has a . in it:

    https://opentype.js.org/font-inspector.html