Fonts play a crucial role in the appearance of a website. Using the proper font can increase your website’s traffic and ultimately have a positive impact on your SEO. Visitors won’t spend too much time on a website with the unreadable font. Even if the content is valuable.
You may have visited a website before where its font caught your attention and you wanted to know which font they are using.
You are able to view images, CSS features and etc. by inspecting a website. You can also find a website’s font through inspection.
Although some website owners tend to change the name of the font they are using and this makes it very difficult to detect which font they are using.
Identify fonts by using Inspector font detector
Most web browsers allow you to use “Inspect” or “Inspect Element” to identify a website’s font. Also, to use the inspector you can simply press F12 on your keyboard.
By doing so, you will be able to see some parts of the code behind the website, and you can simply look for its font in the HTML code. Using the inspector is really simple and you don’t need to use any extensions.
With the inspect element you can view HTML, CSS, and JavaScript of any web page and make edits to those pages (these changes are only visible on your browser and won’t be saved).
All the styles of a page are listed in the styles tab. But if you use the “computed” tab instead of styles tab, you can find the website’s font through font-family it uses.
Another method you could use is, go to your desired website/page and from “Application” enter “Frames” and click on “Fonts”. This will display all the fonts, however, it’s rather slow, but with the help of inspector you can get an idea where to look for. To use the inspector in Windows operator you can use Ctrl+Shift+I and for Mac, Cmd+Shift+I to access inspector.
Identifying fonts using Extensions
Extensions or add-ons are the easiest way to detect fonts. Fontanello and Whatfont are popular in Google Chrome, Firefox, and Safari which can be added with only a few clicks.
To use these add-ons, simply open your preferred website and hover your mouse over a sentence or a word.
How to detect a font used on an image
Sometimes you may wonder which font people use in their logo. In this case, you can’t use the inspector.
We have written a proper article about detecting font from picture with 5 different tools to choose from. Here we will introduce one.
To identify fonts used in an image you have to use a tool called Font Squirrel Matcherator. To use Matcherator follow these steps:
- Download the image and upload it onto Matcherator interface.
- From the toolbar select the blue color to select the part of the image you wish to inspect.
- Once you have selected your desired section, click on “Matcherate it”.
You will then see the results of the analysis. If the font is different from what you see on the image, you could look for the font in the recommended section of this tool.