Choosing the right font type, size, color etc is an important part of designing your website or blog. For this, you can refer to famous websites to see what type of fonts they are using for title headings, post body and so on. You can easily detect or check website fonts using plugins on your browser on your PC or Mac.
When I first designed my blog I didn’t know how to use plugins to check fonts of websites, I would simply copy the texts and paste it on Microsoft word but that would give me the wrong fonts. You can save your time by simply following these steps to identify or find out website fonts on your browser:
- If you are using chrome, simply install this extension: Whatfont for Chrome
- For safari install this extension: Whatfont for Safari
- For other browsers, Firefox 3.6 +, Internet Explorer 8+ …use the Bookmarklet method
Once the extension is installed in Chrome or Safari, you will see the whatfont icon at the top right corner of the browser:
- To detect its fonts, open the website on your browser
- Press the icon
to enable Whatfont - Now Hover your mouse pointer on top of the website texts and you will be able to view the font type and left click to view details such as font size, type and line height.
- To Exit Whatfont, click on the top right corner of browser window
If you are using the Whatfont booklet in firefox, internet explorer, Safari or Chrome,
- Open the website whose font you want to check
- Click on Whatfont from your bookmarks list
- Hover your mouse pointer on top of the website texts and you will be able to view the font type and left click to view details such as font size, type and line height.
- To Exit Whatfont, click on the top right corner of browser window