Web Fonts are the sole reason behind the outstanding web designs that you see today. Most often while visiting a blogger blog or website you wish to know what font type, font family. font color or font size the page is using. It is a perfect tool for web designers and developers to find out font details of a web page. Most people are not that skilled to find the answer using the source code of the page but know thanks to amazing Firefox Add-ons things are becoming more simple and easy to use. With Firefox Add-on Font Finder you can now easily analyze every single bit of information related to the Font being used. This little add-on lets you find 9 set of important information which are,
- Font color
- Background color
- Font family
- Font being rendered
- Font size
- Line-height, vertical-align, letter and word spacing
- Font weight, style, variant
- Text transform, decoration, align and indent
- Element's type, class or ID
You can download this add-on by clicking here
How To Find out Font Details of a Webpage or Blog?
Once you install FontFinder on your Firefox browser, then it will appear at the bottom left corner of your status bar. Highlight any text which you want to analyze and then press right click and choose FontFinder > Analyze selection
On clicking the analyze selection button you can find out complete details about the font style used on any webpage.
You can now easily see what is the hexadecimal or rgb color code of the highlighted text, what font family and font size is used and how the font is aligned and spaced along with what CSS class or CSS ID is used to style the font. You can then check the source code of the webpage to find out the CSS code for this font style.
I just hope it helps you in better experience the web and in better understanding designing. Have fun! :))