How To Find The Fonts Used, Size And Color On Any Website

Most of us browse internet on everyday basis and sometimes we come through few beautiful fonts used in different websites. Some of them are so nice that we want to use them in our websites, blogs or somewhere else. But we stuck most of the times because we don’t know what’s the name and size of the font. Some of us look into the Source Code of that particular webpage to find the font which we liked.

This technique might be simple for developers and designers but surely not the easy way for those who are not familiar with the CSS codes and all.

So there are 2 Add-ons for Firefox to find the fonts, font color and font size very easily used in any webpage you are browsing. Let’s see them one by one in detail:

1) Font Finder : It is a Firefox Add-on which will help you to find the font used in a particular website by selecting some portion of the text you need to know and right clicking on it will show you the font used. The key features of Font Finder are :

  • Any font on a page can be completely analyzed
  • Any piece of an element’s information can be copied to the clipboard
  • Font-families can be disabled from the entire page, to test degradation for cross-OS support
  • Any active element can have any piece of the font’s options (such as color, size or family) adjusted inline

When you select the text, right click on it and you will find “Font Finder” option in the context menu. Just click it and you will get all the information regarding the selection text. Now you can use this information to download the font and use it anywhere.

2) Context Font : This is another extension to find the font and its size right inside the Firefox context menu. After installing it, select some sample text and right click on it, the Add-on will show the font used and its size easily.

The Context Font will not show the font color as the above add-on. It displays the size (px), font-family, font-style, font-weight, and font-variant of selected text in the contextual menu.

It also displays the downloadable font files for the font if specified by a @font-face rule.

I believe that Font Finder and Context Font are probably the simplest way to find the fonts used and its properties on any website.

I hope these add-ons will be useful for you and now finding the fonts used in any web page will not be difficult for you.

 

Leave a Reply