While browsing online, you can come across some nice fancy fonts used on a webpage. Those who have some CSS knowledge can check the stylesheet and know which font is used. One more solution is to use Firebug, a Firefox extension, but this is again a complicated stuff. Those of you who are using Google Chrome web browser, here’s something far more easier. WhatFont is a Chrome extension that helps you to quickly detect/identify which fonts are used in any webpage.
After installing this Chrome extension, you’ll be able to see a new icon in the toolbar. All you need to do is to first click on this button and then mouse over to any font in the webpage. If you want more information like font family, font size and line height, then just click on the text in the webpage. A small box will pop-up which will have additional information about that font. In short, first click on this “what font” button from the toolbar and then text that you want to identify.
You can see in above screenshot that font used is Arial – regular, font size is 13px and line height is 15px. If you click on images, then it prompts a message “May be incorrect on images”. It also detects the services used for serving the web fonts like Typekit and Google Font API. What Font is a superb tool to find the font used in any webpage.
Bookmarklet to Detect Fonts Used in a Webpage
For those who are not using Chrome, can also use a bookmarklet. You just need to drag and drop this bookmarklet to your bookmark bar. From the below link, you can download both the Chrome extension, Safari extension and the bookmarklet, just click on the desired option. The plus point of using bookmarklet is that you can follow the same process for any browser.