Where to see font files loaded by chrome in the inspector?

google-chrome fonts font-face web-inspector
o_O picture o_O · Sep 19, 2013 · Viewed 37.7k times · Source

What tab in chrome inspector shows the font files you're loading via font-face? I can't find it under resources. I'm having an issue where one group of font-family files are loading, but another font-family is not. I have checked everything from going directly to the URL and seeing they are indeed present, but I would like to look in the inspector and see it loading the one font-family but not the other. Is this possible with chrome?

Answer

Jason Yaraghi picture Jason Yaraghi · Sep 19, 2013

You can view the downloaded web fonts using the Network tab:

Google Chrome Network tab showing downloaded web fonts

Related questions

@font-face for custom fonts, fonts not smooth in Chrome

I have a web application that is using CSS3's @font-face to embed custom fonts. So far this has works perfectly in IE and Firefox. With Chrome, however, the custom fonts appear pixelated and not smooth. Below is a link …

Read More
Chrome svg-Font-Rendering breaks Layout

I'm currently working on a little Project in which I'd like to use webfonts via @fontface. I implemented the font's like this: @font-face { font-family: 'CardoRegular'; src: url('../fonts/Cardo104s-webfont.eot'); src: url('../fonts/Cardo104s-webfont.eot?#iefix') …

Read More
Google I/O - Roboto Font (new version) font rendering issues in Chrome (windows)

After listening to the latest Google I/O stream I was more than happy that they released a new version/update for their own font Roboto in their style guide. http://www.google.com/design/spec/style/typography.html# ! Note …

Read More