How to See What Fonts a Website is Using

How to See What Fonts a Website is Using

If you’ve ever wondered how to see what fonts a website is using, the answer is as simple as clicking a button.

All you have to do is install a browser extension and, a few clicks later, you’ll know valuable details about a website’s fonts, such as name, family, size, colors, style, and more.

?? Click here if you prefer to read this post on our blog.


How to find what fonts a website is using

What you’ll read next is how to use the WhatFont extension in Google Chrome. If you use another browser, WhatFont has alternatives for?Firefox?and?Safari.?Font Finder is an additional browser extension if you prefer?Microsoft Edge?or?Opera.

Without further ado, this is how to find out what fonts a website is using in the Chrome browser:

  1. Install the?WhatFont?browser extension by clicking?Add to Chrome, then?Add Extension?in the popup that will appear. Once installed, click on the extension’s icon to activate it and restart the browser. You can also pin the icon to the toolbar to make it more handy.

  1. Go to any website you want and hover over the fonts you’re curious about. The extension will show you the fonts’ names as you scroll the web pages. If you need more details about a particular font, you can click on it and a popup box will show up with information like size, color, family, and style.

If you don’t want to see font names anymore, just click on the extension icon again, then?Exit WhatFont.

How to find out what fonts a website’s images are using

One additional twist: what if you want to see what font an?image?is using? For example, you may be curious what fonts are used in the site’s logo or in an infographic. In that case, your browser extension won’t be helpful.

There’s an awesome web app for this, and it’s called?WhatTheFont. Here are the basics of using WhatTheFont to identify the fonts in an image:

  1. Download the image from the site (using right-click >?Save Image As?or another method), and upload it into the WhatTheFont interface.
  2. Use the white selection box to choose the?part?of the image whose font you want to analyze. (You should see the software start to put little “boxes” around things it identifies as font characters.)
  3. Click?Identify font.?

The results should give you fonts that match your selected text very closely. If you suspect it’s not an?exact?match, then you can Google further: for example, if the returned result was Adagio Slab, google “Fonts similar to Adagio Slab” and see what comes up. The similar font listings from whatfontis.com seem to be especially helpful.

Thanks for reading, and go figure out some website fonts!

要查看或添加评论,请登录

WPShout的更多文章

社区洞察

其他会员也浏览了