Font Finder: See What Fonts Any Website Uses
Check a website’s fonts
Try , , or
How it works: paste any public URL and the font finder fetches that page’s HTML and stylesheets, reads every @font-face rule and font-family declaration, and resolves CSS variables like Tailwind’s --font-sans. You get each family’s name, where it loads from (Google Fonts, Adobe Fonts, a self-hosted file or a system font), the weights the site actually ships, and whether it sets the body text, headings or code.
What the result tells you
Each row is one font family, sorted so the ones doing real work come first. A family that appears in the body or html rule is marked Body text. One used by h1 through h6 is marked Headings, and so on. When a site sets its base font on a wrapper class instead of body, which is common in React apps, the earliest declared family is marked Body text (likely).
The source tells you what you would need to use the same font:
| Source | What it means | Can you use it? |
|---|---|---|
| Google Fonts | Loaded from fonts.gstatic.com | Yes. Google Fonts are open-licensed, mostly under the SIL Open Font License |
| Adobe Fonts | Loaded from use.typekit.net | With an Adobe Creative Cloud plan that includes the font |
| Self-hosted | A font file on the site’s own server or CDN | Check the foundry. A file on someone’s server is not a licence |
| System font | Ships with the visitor’s operating system | Yes, by naming it in your own font stack |
| Web font (file not in scanned CSS) | Named in CSS, but its @font-face wasn’t in the stylesheets we read | Look it up by name, or inspect the live page |
What a URL scan can’t see
This tool reads the CSS a server sends. That covers most sites, including WordPress, Shopify, Webflow, Squarespace and anything built with Tailwind or plain CSS. It misses three cases:
- Fonts injected by JavaScript. CSS-in-JS libraries and some single-page apps write their styles after the page loads, so the stylesheet we fetch doesn’t contain them.
- Text inside images, canvas or SVG paths. There is no font to detect, only pixels or outlines. Use an image matcher such as WhatTheFont for those.
- Pages behind a login or a bot challenge. The scan sees the sign-in page, not your dashboard.
For those, check the rendered page in your own browser. Chrome DevTools shows the font that actually painted a selected element under Computed → Rendered Fonts, and our guide to five ways to find what font a website uses walks through each method, including a console snippet that lists every loaded font face.
Need the whole type system, not just the names? CSS DNA, a browser extension for inspecting CSS, reads the live page, including JavaScript-rendered and logged-in pages. Hover any text to see its family, weight, size and line height, or scan the page for its full type scale. Add it to Chrome (free).
Font finder vs. font identifier
The two names get used for different jobs. A font finder like this one reads a website’s code and tells you the exact family the designer specified, so the answer is never a guess. A font identifier such as WhatTheFont or Font Squirrel’s matcher looks at an image of letters and suggests fonts that look similar, which is the right tool for a logo, a poster or a screenshot. If the text on a page is selectable, a font finder gives you the true answer. If it isn’t, you need an identifier.
Questions
Is the font finder free?
Yes. There’s no account, no limit we enforce per visitor, and no email gate. We don’t store the URLs you check, and responses are cached for a day so repeat checks are fast.
Why does it show a different font than my browser?
A font stack lists fallbacks. If a site asks for “Söhne, Helvetica Neue, Arial” and the Söhne file fails to load, your browser paints Helvetica Neue. The scan reports what the site asks for. DevTools’ Rendered Fonts panel reports what your machine actually painted.
What do weight ranges like 100–900 mean?
A range means a variable font: one file that contains every weight between those numbers. A list such as 400 500 700 means separate files for each weight.
Can I download the font files?
The tool shows where each file is hosted, but having the file doesn’t give you the right to use it. Read how to download fonts from a website, and when you’re allowed to before you reuse a self-hosted font.
Why did it find no fonts?
Either the site uses only system fonts, or it sets fonts through JavaScript at runtime, or it blocked our request. The result message says which case it detected.
Read fonts on the live page
Hover any text for its family, weight, size and line height, then see the site’s full type scale. Works on JavaScript-rendered and logged-in pages.
Add CSS DNA to Chrome (free)Free: element CSS, eyedropper, ranked palette, font readout. Pro, $5/mo after a 7-day trial: exports, DESIGN.md, CSS audit. No account.