Hey there font finders,

A few of you may have noticed (if you do not use Old Reddit) I added a Community Home Hub at the top of the subreddit that lists a few Frequently Identified Fonts and well as websites used to search for font IDs. I know this will not prevent some people from asking us to identify Papyrus for the unquantifiable time but it will filter out a few low effort posts and be helpful to others.

My question to you all is what fonts do you think are missing from the list and to share any other websites or resources you think are missing and could benefit font seekers in the future. Let me know in the comments below!

I've seen a small influx of folks taking screenshots of websites and asking what font they're looking at or have highlighted, so let's go ahead break down some basics:

If you are on a website and the font is able to be highlighted, it is in the code of the website and it will call the font, usually a WOFF file, to come into existence. It will also tell you the settings, if there are any, that have been applied to the font. If the font is not "highlight-able", it is embedded in an image and will need to be identified. Below are the "hacks" to find them:

FIREFOX

1. Highlight the text.
2. Right click and go to "Inspect".
3. If your dock is on the right side, click the 3 dots on the top and dock it to the bottom.
4. On the right side, you'll see "Layout" highlighted for the third column. If you browse over on that line, you will see "Fonts". Click on "Fonts".
5. You should see the font of the selected text and its settings on your browser: Size, Line Height, Spacing, Weight, and Italics.
6. Underneath that, you will see a dropdown for "All Fonts on Page." Click on this to find other fonts that are currently embedded in the page. Fonts marked "System" are generally installed on your pc/browser already. Anything with a link underneath are fonts that are being fed to you through the page.

If you want to find another font and its settings on the page itself, go to the element highlighter on very top left of the element panel (square icon with a mouse) and highlight the element that you want to look at, or you can highlight the text as before, right click, repeat the steps.

CHROME / EDGE

1. Highlight the text.
2. Right click and go to "Inspect"
3. If your dock is on the right side, click on the 3 dots on the top and click the icon to dock it to the bottom.
4. On the right side, you'll see "Styles" highlighted in the second column. If you browse over on that line, you'll see "Computed". Click on "Computed".
5. In "Filter", below the box diagram, type in "font". This will bring up the font and its settings. Clicking on the dropdowns show you where it inherits each setting in the code.

Unlike Firefox, you will need to highlight text individually on the page to see its attributes/font style. You can also use the element highlighter on the very top left of the element panel (Icon with a Square and a mouse pointer) to pick another piece of text.

ADDONS / EXTENSIONS

Let's say you don't want to have the crazy hassle of looking this stuff up, especially on Chromium-based browsers. Wat do? There are some wonderful add-ons and extensions for this exact work for folks that love design/finding fonts just as much as you and I.

FIREFOX

• Fonts Ninja - Download - This font extension is great. Not only does it show the fonts on the page, you can also preview text, bookmark fonts for later while brainstorming, and you can find out where to buy them or download for a free trial. It's a fantastic tool if you come across fonts on a regular basis or need to know exact settings. Hover over text on the page while the extension is open for specifics on that particular text.

• WhatFont - Download - Simplified font identifier tool that conveniently tells you what font you are hovering over. Click on the font to display a small summary of what its attributes are.

• Font Finder (Revived) - Download - Font Finder lets you click on the icon, then click on the font of your choice and displays the results on a separate page so that you can have the results with you at all times.

CHROME

• Fonts Ninja - Download - This font extension is great. Not only does it show the fonts on the page, you can also preview text, bookmark fonts for later while brainstorming, and you can find out where to buy them or download for a free trial. It's a fantastic tool if you come across fonts on a regular basis or need to know exact settings. Hover over text on the page while the extension is open for specifics on that particular text.

• Font Finder - Download - Font Finder lets you click on the icon, then click on the font of your choice and displays the results on a separate page so that you can have the results with you at all times.

• Font Identifier by WhatFontIs - Download - Nothing like having the power of a font identifier service in your back pocket. You can use this to find not only the fonts on the page, but also fonts (or similar fonts) in images, as well as have suggestions for similar free fonts to ones that are paid for.

Feel free to suggest more good add-ons or tips and tricks, but I think this pretty much covers it and hopefully clears up a bit of the confusion when trying to find fonts on websites. Happy Hunting!