Free Website Font Detector
Find the fonts on any website
We read the page's HTML and CSS from our server and list every font family it loads or names, with its role, source and licence.
Public pages only. A page behind a login returns its login screen, and private network addresses are refused. This reads website code, so it cannot identify a font inside an image or logo.
The Website Font Detector is a font checker and font finder by URL. Enter an address and it identifies the fonts on a website from the HTML and CSS the site sends: each typeface, the job it does on the page, where it loads from, whether its licence lets you reuse it, and the closest free Google Fonts when it does not. It reads website code, so a font inside an image, logo or screenshot needs a different kind of tool that compares letter shapes. Also known as font checker, font finder by URL, website font checker, website font identifier, typeface detector, what font is this website using.
- Free, no signup
- Reads the live HTML and CSS
- Never downloads font files
- Free alternatives for paid fonts
Seeing one of these font errors?
Failed to decode downloaded font, OTS parsing error: invalid sfntVersion, downloadable font: rejected by sanitizer, Slow network is detected, Fallback font will be used while loading, Ensure text remains visible during webfont load. Run the detector to see which fonts the page declares and which stylesheets declare them, then find the matching fix under common font problems below.
Found a font you like?
Use it on a site you own
Google Fonts and custom fonts are available on Grigora paid plans, so any Google Font you found is one pick in the font picker, a font you have licensed can be uploaded, and anything else has a free match. 14 day free trial, no card needed.
How to use the Website Font Detector
Four steps from a URL to fonts you can use.
Enter the website URL
Paste any public page address. A bare domain such as example.com works too.
Run the detector
Our server reads the page HTML and up to 12 of its stylesheets, looking for font links, @font-face rules and font-family declarations.
Read the fonts by role
See which family sets headings, body text, buttons and code, where each one loads from and what its licence allows.
Copy the CSS or a free match
Copy the font-family stack or the Google Fonts link, or take the closest free Google Font when the original needs a paid licence.
How to use the Website Font Detector, step by step
Real screenshots of the tool, taken while checking a live website.
- 1
Enter the site address
Type a domain or paste a full page URL. One page is read per run, from our server, without running its scripts.
- 2
Run the detection
The server reads the page HTML, up to 12 linked stylesheets, and any Google Fonts or Adobe Fonts links.
- 3
Read each font card
Every family shows its role, source, licence, weights and a live preview, with free alternatives where the licence is paid.
How the detector reads a website
It reads the code the site sends. It does not run scripts or render the page.
It reads what the server sends
The page is fetched from our server with an honest user agent. Stylesheet links, style blocks, font preloads, inline styles and Google Fonts or Adobe Fonts links are collected in document order.
It parses the CSS
Up to 12 stylesheets plus one level of @import are parsed. @font-face rules give each family its weights, styles and files, and CSS variables such as var(--font-body) are resolved.
It works out each font's job
Rules on body, h1 to h6, buttons and code decide the roles. Nothing runs in a browser, so treat roles as a best guess: a script can swap fonts later, and a device can show a fallback.
What the font sources mean
Where a font loads from tells you who controls it and what you may do with it.
Google Fonts
An open source library that Google serves for free, or that a site copies to its own server. Every family is free to use, commercial work included.
Adobe Fonts
Fonts from Adobe's subscription library, served through a web project kit. Web use depends on an active Adobe plan, and the files are not yours to self-host.
Self-hosted
The site serves the font files itself. That can be an open source font or a commercial one bought from a foundry; the name and the licence file tell you which.
System font
Named in the CSS but never downloaded. Arial, Georgia, Segoe UI and San Francisco ship with operating systems, so each visitor sees their own copy.
Platform library
Shopify, Wix and Squarespace supply fonts for sites on their platforms. Check the licence before using one of those fonts anywhere else.
Other font services
Bunny Fonts mirrors Google Fonts. Fontshare offers free fonts under its own licence. Monotype Fonts and Typography.com serve paid fonts to licensed sites.
Font licences in plain English
What each kind of licence usually lets you do. This is general information, not legal advice.
Open source (SIL OFL)
Most Google Fonts use the SIL Open Font License. You can use them on websites, in print and in apps, commercial work included, and host the files yourself. You cannot sell the font files on their own.
Adobe Fonts
Included with Adobe Creative Cloud plans. Web use goes through a web project that Adobe serves, so it depends on an active plan and you do not get files to host yourself.
Commercial fonts
Foundries sell desktop, web and app licences separately. A webfont licence is often priced by monthly page views or domains, so owning the desktop version does not cover a website.
System fonts
Arial, Georgia, Segoe UI and similar come with the operating system. Naming them in CSS is fine, but uploading their files to your own server needs a licence from the owner.
When in doubt, read the licence file that came with the font or ask the foundry. The detector shows where a font comes from; it cannot see the licence a site bought.
When to run a font check
Six moments when knowing a site's fonts saves time.
Match a brand's typography
Find the exact families a brand uses before you brief a designer or build a page that should feel the same.
Plan a redesign or migration
Record the current fonts, weights and stacks so nothing changes by accident on the new platform.
Check licences before launch
Spot self-hosted commercial fonts that need a webfont licence, and Adobe kits tied to one account.
Research design inspiration
See which typefaces well designed sites pick for headings and body text, and how many weights they load.
Debug a fallback font
Confirm the CSS names the font you expect and that an @font-face rule or font link declares a file for it.
Find a free replacement
When a font needs a paid licence, get the closest free Google Fonts to try instead.
Use a font you found on your own site
Where fonts are set on the common platforms. Use the original only if you hold its licence; otherwise use a free match.
WordPress
- In a block theme, open Appearance, Editor, Styles, Typography and use Manage fonts to install a Google Font or upload a font file.
- In a classic theme, use the theme's font settings in the Customizer, or add the Google Fonts link and a font-family rule.
- Run the detector on the live page to confirm the new family loads.
Shopify
- Open Online Store, Themes, Customize, then Theme settings, Typography.
- Pick heading and body fonts from Shopify's font library.
- For a font outside the library, upload the files under Content, Files and reference them in an @font-face rule in the theme CSS.
Webflow
- Open Site settings, then Fonts.
- Add a Google Font by name, or upload font files you hold a licence for.
- Apply the family in the Style panel, then publish and run the detector again.
Grigora
- Open the editor's theme settings and pick any Google Font in the font picker.
- For a font you have licensed, upload the .ttf, .otf, .woff or .woff2 file under Settings, Custom Fonts.
- Google Fonts and custom fonts are available on Grigora paid plans.
Free alternatives to popular fonts
Close free matches on Google Fonts for fonts that need a licence or only exist on some devices. The detector suggests these automatically when it finds one of 85 commercial and system fonts it knows.
Helvetica Neue
Ships with some devices, sans serif
Arial
Ships with some devices, sans serif
Arimo is metric compatible with Arial, so text reflows identically.
Proxima Nova
Commercial, sans serif
Gotham
Commercial, sans serif
Circular
Commercial, sans serif
Avenir
Ships with some devices, sans serif
Futura
Ships with some devices, sans serif
DIN
Commercial, sans serif
Söhne
Commercial, sans serif
Segoe UI
Ships with some devices, sans serif
Graphik
Commercial, sans serif
Times New Roman
Ships with some devices, serif
Tinos is metric compatible with Times New Roman.
Georgia
Ships with some devices, serif
Gelasio is metric compatible with Georgia.
Garamond
Commercial, serif
Baskerville
Ships with some devices, serif
Didot
Ships with some devices, serif
Consolas
Ships with some devices, monospace
For a font it does not know, the detector suggests popular free fonts of the same style. Google Fonts are available on Grigora paid plans.
Website Font Detector vs. other ways to identify fonts
What each approach can and cannot tell you.
| Capability | This detector | Browser DevTools | Image font identifiers |
|---|---|---|---|
| Nothing to install | Yes | Yes, built into the browser | Yes |
| Starts from a website address | Yes | You open the page yourself | No, needs an image |
| Lists every font family a page loads | Most, from the HTML and CSS; not fonts added by JavaScript | Network panel, filtered to fonts | No |
| Shows the font each element renders | No, declared fonts only | Yes, in the Computed tab | No |
| Identifies lettering in an image or logo | No | No | Yes |
Common font problems and how to fix them
The messages browsers and audits print, what causes each one and what to change.
Failed to decode downloaded font
Cause: The browser asked for a font file and got something else, usually an HTML error page or a file damaged on upload.
Fix: Open the font URL from the message. It should download a font, not show a page. Re-upload the file if it is damaged.
OTS parsing error: invalid sfntVersion
Cause: Chrome's font sanitizer rejected the file because its header is not a valid font.
Fix: Confirm the URL returns the real woff2 or woff file, then export a fresh copy from the source if it still fails.
downloadable font: rejected by sanitizer
Cause: Firefox's wording for the same problem: the downloaded file failed validation.
Fix: Check the file URL and the type it is served with, and replace the file with a fresh copy.
Access to font at ... has been blocked by CORS policy
Cause: The font lives on another domain, such as a CDN, that does not send an Access-Control-Allow-Origin header.
Fix: Add that header on the font host for your domain, or serve the files from the same domain as the page.
Slow network is detected ... Fallback font will be used while loading
Cause: Chrome saw a slow connection and showed the fallback font while the web font downloads.
Fix: Serve woff2, load fewer weights, preload the main text font and set font-display: swap.
Ensure text remains visible during webfont load
Cause: A Lighthouse audit: text stays invisible until the font arrives because font-display is block or not set.
Fix: Add font-display: swap to each @font-face rule, or &display=swap to a Google Fonts link.
The live site shows Times or Arial instead of the font
Cause: The CSS names a font that no @font-face rule or font link loads, so browsers use the next name in the stack.
Fix: Run the detector. A font marked "Declared in CSS, font file not found" needs a Google Fonts link or an @font-face rule.
Bold or italic text looks smeared
Cause: The CSS asks for a weight or italic that was never loaded, so the browser draws a synthetic version.
Fix: Load that weight, or change the CSS to a weight the detector lists for the font.
What one scan covers
The limits of the detector, stated plainly.
Frequently asked questions
Short answers about finding the fonts on a website.
Related free tools
Other design and website checks that pair with the Website Font Detector.
Color Palette Generator
Build a palette with HEX, RGB and HSL values to pair with your fonts.
Try itImage Color Palette Extractor
Pull the main colors out of a screenshot of a site you like.
Try itContrast Checker
Check text and background colors against WCAG contrast ratios.
Try itWebsite Screenshot Generator
Capture a full page screenshot of any public URL.
Try itWebsite Grader
Score a website out of 100 on speed, findability, security, mobile and customer basics.
Try itFavicon Checker
Check that every icon a site declares actually resolves.
Try itPut the fonts you like on a site you own
Grigora runs your website, email and store on one platform, with Google Fonts and custom fonts on every paid plan. 14 day free trial, no card needed.
Start your free trial