Find out What Fonts Family a Website is Using

By  at 12:13 PM    

find font detailsWeb 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,

  1. Font color
  2. Background color
  3. Font family
  4. Font being rendered
  5. Font size
  6. Line-height, vertical-align, letter and word spacing
  7. Font weight, style, variant
  8. Text transform, decoration, align and indent
  9. 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

find font details

On clicking the analyze selection button you can find out complete details about the font style used on any webpage.

find font details

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! :))

Related Posts:

  • Identify Font Type and Font Color on a WebsiteWhatfont a great chrome extension that lets you easily identify the font family, font size and font color of the text being used on any webpage. It gives you complete details about the type of being used and what other altern… Read More
  • Back To Top and Back To Bottom Buttons For BlogsI wondered why don't we use back to bottom buttons just like back to top and this idea led me to jump at Photoshop again. The collection today consists of 20 high quality PNG static images that will allow your visitors to scr… Read More
  • Make a Button Badge For BlogSpot and WordpressYou have seen many blogs and directories using a small button for their promotion. You can see one for mbt too. This micro button comes in 80X15 pixels in size. I would create such buttons using Photoshop but amazingly thanks… Read More
  • How To Find width and height of Images on a Webpage?There is an excellent browser add-on that I am using since years while designing templates. Its called measureit. It lets you measure the dimensions of images and other webpage elements by telling you the exact width and heig… Read More
  • Make Colorful Tables in BlogSpotBlogSpot blogs are rich with options that gives you freedom to design and create whatever you want using CSS and HTML. Blogger post editor doesn't has the option of creating HTML tables but no worries we can make tables with … Read More