Have you ever visited a website and liked the font they were using? Want to know the secret to figuring out what font any website uses? Here’s a simple trick to find out.
Use a Font Finder Bookmarklet
Go to This Website and drag their font finder bookmarklet to your browser’s bookmark bar. It will be labeled “FontFinder”.
Activate the Bookmarklet on a Web Page
When on a webpage with a font you want to identify, click the FontFinder bookmarklet. This activates the script.
Your cursor will turn into a plus sign, indicating it is ready. Hover and click on any text or element on the page.
A popup will appear, identifying the font name, size, weight, and style of the text you clicked.
Check Different Elements on the Page
Test out different sections, like headlines, body text, captions, etc. The font finder will work on any text or element.
You can disable the bookmarklet by clicking the “FontFinder” label in the popup. This deactivates the script so your cursor returns to normal.
Use It on Your Own Website
Try it out on your own website to double check it identifies fonts correctly. Since you set the fonts, you can verify the bookmarklet’s accuracy.
This font finder bookmarklet is an easy way to satisfy your font curiosity on any web page. No more wondering “what font is that?” while browsing. Just click and discover!
Watch the Video Tutorial
Identify Exact Fonts Used in the images
If you are looking for the font used in images, there is a different tool that will easily let you do that. Check out this block post.