How do I download/extract font from chrome developers tools?

I have tired many things but i can't get it even though my computer has it.

How can I access this wont files? They have the .woff extension. Double clicking them in chrome inspector just takes to some url. Which doesn't work.

Nor this font is installed on my computer.

This is in fact first time in my life I have come across woff format and the concept web open format. I want to download the font website is using. I know I can download the images why not wont.

Solution 1:

To get .woff fonts first open the chrome dev tools panel (Ctrl+Shift+i) go to Network and reload the page. There you will see everything the page downloads. Find the .woff file, right click and select Copy response.

The response will be a url so paste it in the navigation bar. A file will be downloaded, just add the .woff extension to it and voila.

Solution 2:

Right-click, then "Open link in new tab"

edit : you can also double-click, it has the same effect

Solution 3:

It's easy (For Chorme only)

1. Right click > inspect element
2. Go to 'Resources' tab and find 'Fonts' in dropdown folders
   • 'Resouces' tab may be called 'Application'
3. Right click on font (in .woff format) > open link in new tab (this should download the font in .woff format
4. Find a 'Woff to TTf or Otf' font converter online
5. Enjoy after conversion!