Font Subsetter

How to subset a font

1. Check the license. Subsetting creates a modified copy of the font. Open licenses such as the SIL Open Font License (OFL) and Apache 2.0 allow it; many commercial desktop and web licenses don’t, or only under conditions. Read your font’s license first.
2. Drop a TTF, OTF or WOFF file on the drop zone, or click it to choose one. The Original font panel shows the family, the format, the file size, the number of glyphs and the number of characters the font maps.
3. Choose the Characters to keep: Basic Latin, Latin-1, Latin, as in Google Fonts, French and Digits and number signs can be combined. Add your own characters in Characters from a text (every distinct character of the text is kept) or in Unicode ranges, written like CSS: U+0020-007E, U+2013, U+04??.
4. Tick Remove hinting if you want the smallest possible file.
5. Click Subset font. The engine (about 650 KB) loads the first time, then the font is processed on your device.
6. Compare the sizes in Result, look at the Preview of the subset, then use Download TTF (or OTF) and Download WOFF, and copy the CSS @font-face rule.

The font file never leaves your computer: it is read, subset and re-packaged in the browser.

What subsetting does

A font often contains hundreds or thousands of glyphs: Cyrillic, Greek, Vietnamese, symbols, alternates. A page written in English or French uses only a fraction of them. This tool runs hb-subset, the subsetter of the HarfBuzz text engine (the same code used by Google Fonts and many build tools), compiled to WebAssembly. It keeps the glyphs for the characters you selected, plus the glyphs that OpenType features need to display them (ligatures such as “fi”, small caps and accented forms when they are reachable from your characters), and removes the rest. Kerning and other layout tables are cut down to match.

Typical results: a full Latin + Cyrillic + Greek font of 300 KB can drop to 20 or 30 KB for French text, and a logo font subset to the letters of a single word often weighs a few kilobytes.

The Not in the font line lists characters you asked for that the font doesn’t have. Browsers will draw them with a fallback font.

Output formats and unicode-range

• TTF/OTF: the subset keeps the outline type of the original (TrueType or CFF).
• WOFF: the same font with each table compressed with zlib. Every current browser reads it. A WOFF input is decompressed first.
• WOFF2 is not available: its Brotli compression and table transforms have no encoder in the browser, and WOFF2 files can’t be read here either. Convert WOFF2 to TTF first (for example with fontTools). Your server can also compress the TTF/OTF with gzip or Brotli on the fly.

The CSS @font-face rule lists the WOFF file first, sets font-display: swap and adds a unicode-range built from the characters actually present in the subset. With unicode-range, the browser downloads the file only when the page uses one of those characters, so you can split a family into several files (for example Latin and Cyrillic) and let each visitor load only what they need. Edit the font-family name to match the name used in your stylesheet.