What font is this website using?
Paste a URL to see every font on the site: families, weights, and where they come from β Google Fonts, Adobe Fonts, self-hosted files, or system stacks. Fully free, with live previews.
Detecting fonts on
Fetching the page and its stylesheets, reading @font-face rules and font services...
Everything about a site's typography, in one look
Stop digging through DevTools. The report answers the questions designers actually ask about a site's fonts.
Every family, with live previews
Each font family on the page, with sample text rendered in the actual font for Google and Bunny fonts, so you can judge it at a glance.
Weights & styles
The exact weights loaded (300, 400, 700...), italics, and variable font ranges like 100..900 β read from @font-face rules and font service URLs, not guessed.
Where fonts come from
Google Fonts, Bunny Fonts, Fontshare, Adobe Fonts kits (with kit ID), self-hosted .woff2 files with direct links, or pure system font stacks.
WordPress theme.json presets
Block themes declare their typography as theme.json presets. We surface them separately, so you see exactly which fonts the theme designer intended β a detail generic font tools miss.
The type scale
Every distinct font-size in the CSS, ordered small to large, plus sizes and weights declared for body text and headings β a ready reference for your own scale.
Free PDF export
Save the whole font report as a PDF for your moodboard, client deck, or design handoff. No email, no watermark.
How to see what font a website uses
No install, no login, no DevTools. Three steps and about five seconds.
1. Paste the URL
Type any domain. We normalise it for you, so example.com and https://example.com both work.
2. We read the CSS
Our server fetches the page and its stylesheets, then extracts every @font-face rule, Google Fonts link, Adobe Fonts kit, and font-family declaration.
3. See the fonts
Every family with its weights, styles, and source, plus live previews and the type scale. Save the whole report as a PDF β free, no email.
"What font is this website using?" β three ways to answer it
You can find a site's fonts by hand. Here's how each method works, and where it falls short.
Method 1: Inspect element in DevTools
Right-click the text, choose Inspect, and read the font-family under the Computed tab. This shows the exact rendered font for one element β but only that element. To map a whole site's typography you'd repeat it for headings, body text, buttons, and navigation, then dig through the Network tab to learn which weights actually load and where the files come from. It works, and it's a skill worth having, but it takes minutes per page and isn't possible at all on a phone.
Method 2: A font-inspector browser extension
Extensions like WhatFont show the font under your cursor β great for a quick hover check on your own machine. The trade-offs: you need to install one, it inspects one element at a time, and it won't tell you the loaded weight set, the font's source, or anything about the site's overall type scale.
Method 3: A web-based font checker (this tool)
Paste the URL and get the whole picture at once: every family, the exact weights and italics loaded, whether the fonts come from Google Fonts, Adobe Fonts, or the site's own server, WordPress theme.json presets, and the complete font-size scale β with live previews and a free PDF. It runs server-side, so it works from any device with nothing to install. Run a site through the detector and compare it with what an hour of manual inspection would give you.
Typography is usually step one of a bigger question β "how is this site built?" If that's where you're headed, pair this report with our WordPress Tech Stack Report for the theme, plugins, and hosting behind the same URL, or read our guide to reverse-engineering a WordPress design end to end.
What people do with a font report
The same report answers different questions depending on who's holding it.
Identify a font you fell for
Saw a site with beautiful typography? Get the exact family and weights in seconds, preview it live, and drop it straight into your moodboard instead of guessing from screenshots.
Rebuild typography in a redesign
Migrating or rebuilding a site? The report is a ready spec: families, weights, fallback stacks, and the type scale β everything you need to reproduce the typography faithfully.
Audit a prospect's typography
Walk into a pitch knowing the client loads five font families in nine weights. A concrete "your fonts are hurting your load time" finding beats a generic redesign promise.
Check brand consistency
Confirm your landing pages, blog, and shop actually use the brand fonts your guidelines specify β and catch the odd page still serving the theme's defaults.
Trim unused font weight
Run your own domain: every weight you load but never use is wasted bytes on every visit. Cutting a font file or two is one of the cheapest speed wins available.
See what your theme really loads
Themes and page builders quietly enqueue their own fonts. The report shows what actually ships β including theme.json presets β so you know what you're overriding.
Honest about what we can and can't see
The detector reads the same public HTML and CSS your browser downloads. Here's what that means.
What we detect reliably
@font-face rules and their files, Google/Bunny/Fontshare families and weights (declared in their URLs), Adobe Fonts kits, font-family stacks, WordPress font presets, and every font-size in the fetched CSS.
What's approximate
Per-element sizes are "as declared, before the cascade" β media queries or specificity can change the final rendered size. We only attribute sizes to simple selectors like body and h1, and say so in the report.
What we can't see
Fonts injected by JavaScript after load, text drawn in images or canvas, and stylesheets beyond our fetch cap on very heavy sites. When that happens, the report tells you instead of pretending.
Why not just use DevTools or a browser extension?
You can β but each route answers only part of the question.
| What you want | Inspect element by hand | Font browser extensions | This tool |
|---|---|---|---|
| All families on the page at once | One element at a time | Mostly | Yes |
| Weights actually loaded | Tedious | Rarely | Yes, from the source |
| Where the fonts come from | Network-tab digging | Sometimes | Yes, with file links |
| Works on mobile / no install | Desktop only | Needs install | Any browser |
| WordPress theme.json presets | Manual | No | Yes |
| Type scale overview | No | No | Built in |
| Shareable report (PDF / link) | Screenshots | No | Free PDF + link |
Why fonts are worth checking
Typography is the largest part of most designs β and one of the heaviest things a page loads.
Sources: Stanford Web Credibility Research, HTTP Archive Web Almanac (2022), Google Fonts directory, W3Techs (2026). Figures rounded.
Frequently Asked Questions
How do I find out what font a website uses?
Paste the site's URL above. The detector fetches the page and its stylesheets server-side and extracts every font: Google Fonts and Bunny Fonts from their CSS URLs, Adobe Fonts from the Typekit kit, self-hosted fonts from @font-face rules, and system stacks from font-family declarations. No extension or DevTools knowledge needed β it works on any device.
Is the font detector free?
Yes, completely. Every result β all families, weights, sources, the type scale, and the PDF export β is free with no signup and no email. Fair-use rate limiting is the only cap.
Does it detect Google Fonts and their weights?
Yes, precisely. Google Fonts (and Bunny Fonts, which mirrors its URL format) declare families and weights in the stylesheet URL itself β including italics and variable ranges like 100..900 β so we read them straight from the source rather than guessing.
Can it identify Adobe Fonts (Typekit)?
Yes. When a site loads a use.typekit.net kit, we fetch the kit's CSS and read the families inside it, and show the kit ID. We can't render live previews of Adobe fonts, because their licensing doesn't allow loading them on other domains.
What are WordPress theme.json font presets?
Modern WordPress block themes define typography in a theme.json file, which WordPress outputs as CSS custom properties like --wp--preset--font-family--heading. When we find these, we list them separately: they tell you exactly which fonts the theme's designer intended for headings and body text. Curious which theme it is? Run the same URL through our Tech Stack Report.
Why are the font sizes approximate?
We report sizes as declared in the CSS, before the browser cascade runs. Sizes are attributed only to simple selectors (body, h1βh6, p...), and the type scale lists every distinct font-size value found. The final rendered size can differ when media queries, specificity, or JavaScript override a declaration β a limit of any static analysis, which we state in the report itself.
Can I check a site that isn't WordPress?
Yes. Font detection works on any website. The WordPress-specific extras (theme.json presets, the WordPress badge) simply stay empty elsewhere. Not sure what a site runs on? Try Is It WordPress? first.
What can't the detector see?
Fonts injected by JavaScript after page load (Web Font Loader, CSS-in-JS frameworks), text drawn inside images or canvas, and stylesheets beyond our fetch cap on unusually heavy sites. When any of these apply, the report includes a note saying results may be partial β we'd rather tell you than pretend.
Find the font. Steal the look. Ship the design.
Check any site's typography in seconds β then add the free extension to see themes and plugins on every WordPress site you visit.
Or add the free Chrome extension, rated 5.0/5 on the Chrome Web Store.