Free Font Tool

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.

100% free, no signup Private: no site data stored Results in ~5 seconds
The Report

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.

The Guide

"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.

Who uses it

What people do with a font report

The same report answers different questions depending on who's holding it.

Designers

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.

Developers

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.

Agencies

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.

Marketers

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.

Site owners

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.

WordPress users

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.

How it works

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.

Compare

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 onceOne element at a timeMostlyYes
Weights actually loadedTediousRarelyYes, from the source
Where the fonts come fromNetwork-tab diggingSometimesYes, with file links
Works on mobile / no installDesktop onlyNeeds installAny browser
WordPress theme.json presetsManualNoYes
Type scale overviewNoNoBuilt in
Shareable report (PDF / link)ScreenshotsNoFree PDF + link

Why fonts are worth checking

Typography is the largest part of most designs β€” and one of the heaviest things a page loads.

75%
of users judge a site's credibility by its design
~80%
of web pages load custom web fonts
1,800+
open-source families on Google Fonts alone
~130KB
median font payload a page makes visitors download
~42%
of all websites run WordPress
~5s
from pasted URL to a full font report here

Sources: Stanford Web Credibility Research, HTTP Archive Web Almanac (2022), Google Fonts directory, W3Techs (2026). Figures rounded.

FAQ

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.