Free online font tools
Font previewers, pairing generators, webfont converters, and typography tools.
Five tools for the stage between picking a typeface and shipping it on a page. All of them work on font files you drop in, and all of them load those files with the browser's own FontFace API, which registers the face in the current document and nothing more — the file itself is read from an object URL in the tab and never uploaded. The Font Previewer takes several files at once and shows them against your own sample text at whatever size you set, with a weights view, a side-by-side comparison column and a light and dark toggle, which is the fastest way to find out that a face you liked in a specimen falls apart at 14 px on a dark background. The Glyph Inspector loads one file and walks it block by block — Basic Latin, Latin-1 Supplement, Latin Extended-A and B, Greek, Cyrillic, punctuation, currency, arrows, math operators, box drawing and symbols — showing which characters the face actually carries and letting you search by character, by hex codepoint or by Unicode name. It also measures glyphs with a canvas 2D context, so you get real advance width, ascent and descent numbers plus derived x-height and cap-height for the loaded face rather than the marketing figures. The Font Converter compares one uploaded face across TTF, OTF, WOFF and WOFF2, estimates the file size of each of those four formats from the source file, and writes the matching @font-face rule with every source listed in the order a browser should try them, font-display set to swap, and the family name taken from the file. The Font Subsetter takes the same face and lets you choose which of nineteen Unicode ranges to keep, from Basic Latin through Cyrillic, Hiragana, Katakana, Hangul syllables, CJK Unified Ideographs and emoji, then generates the @font-face CSS with the right unicode-range descriptors, which is what tells a browser to download a font file only when a character in that range appears on the page. Font Pairing is the one tool here that needs no upload: a curated set of heading and body combinations drawn from Google Fonts, filterable by category, each with a ready @import line and the CSS to go with it. Because those specimens are real Google Fonts families, that page is also the only one in this hub that loads anything externally — your browser fetches the preview faces from Google's font CDN, exactly as the generated @import would on your own site.
5 tools · always free · no account needed
Font Converter
Preview fonts and generate @font-face CSS code
Font Previewer
Preview uploaded fonts at different sizes and weights
Font Subsetter
Generate CSS unicode-range for font subsetting
Font Pairing
Browse curated Google Font combination suggestions
Glyph Inspector
View all glyphs in a font file
How to choose the right tool
Work in the order the file moves through your project. When you are still choosing, use Font Pairing to shortlist a heading and body combination, and the Font Previewer to try the shortlist against real copy at real sizes rather than the one pangram every specimen page shows. When you have chosen and something is missing, the Glyph Inspector is the tool that answers it: search for the Polish l-slash, the Turkish dotless i or a currency symbol and see immediately whether the face covers it or whether the browser has been quietly substituting a fallback. When you are about to ship, the Font Subsetter is where the page-weight decision happens — a Latin-only unicode-range on a face that also carries Cyrillic and Greek is usually the single biggest saving available — and the Font Converter is where you get the @font-face block with all four format sources and font-display listed correctly. Note that both of those tools produce CSS and size estimates rather than rewritten binaries: run the generated rule against font files built by your own pipeline or your foundry's web kit.
Frequently asked questions
Do my font files get uploaded?
No. Each file you drop is turned into a local object URL and handed to the browser's FontFace API, which registers it for this document only. The preview, the glyph grid and the measurements are all produced by rendering that registered face in the page. Nothing is posted to a server, which matters with licensed retail fonts where a EULA often forbids transmitting the file to a third party at all.
Which format should I actually serve?
WOFF2 for everything current, with WOFF as the single fallback if you still support very old browsers. WOFF2 uses Brotli compression and is typically the smallest of the four by a wide margin; WOFF is the older zlib-compressed wrapper; TTF and OTF are the uncompressed desktop formats and are the largest to serve over a network. The @font-face rule the Font Converter writes lists the sources in that order, because a browser takes the first format it recognises.
What does unicode-range actually do?
It tells the browser which characters a given font file covers, so the file is only downloaded when a character in that range appears on the rendered page. Split one large face into a Latin file and a Cyrillic file with the right ranges, and a visitor reading an English page never downloads the Cyrillic bytes. The Font Subsetter writes those descriptors for the ranges you tick, across nineteen blocks including Greek, Cyrillic, Hiragana, Katakana, Hangul, CJK and emoji.
Why does the glyph inspector show fewer characters than the foundry claims?
It lists what the loaded file contains, not what the family contains. Foundries usually ship coverage split across several files — a separate Cyrillic or Greek cut, or a full character set only in the desktop package — so a web-optimised WOFF2 will legitimately hold a fraction of the advertised set. A file that has already been subsetted by a build tool or by Google Fonts will show the same reduction. Load the desktop TTF or OTF to see the full inventory.
Can I use any font I upload on my website?
That depends entirely on its licence, and these tools do not check it. A typeface bought for desktop use frequently does not include webfont embedding, and most commercial EULAs limit it by pageview or domain. Open licences such as the SIL Open Font License, which covers most Google Fonts families, do allow self-hosted web use with attribution. Check the licence file that shipped with the family before putting a @font-face rule into production.
You might also need
Generate CSS effects, convert colors, build gradients, animate timing functions, and visualize box-shadows.
DPI calculators, print size converters, bleed/margin setup, and pre-press preparation tools.
Word counters, readability scores, grammar checkers, text transformers, and writing utilities.
Updated