Font Subsetter

A professional font can hold thousands of glyphs for many languages, while a typical English page uses perhaps a hundred. Visitors still download all of it. Subsetting cuts the file to the characters you actually show, which can make a web font much smaller and improve loading, particularly on mobile connections. This page does it in your browser, and then writes the CSS that describes what the subset covers.

How the cut is made

HarfBuzz, the text shaping engine used by browsers and operating systems, includes a subsetter. It keeps the glyphs for the characters you list, then follows the font’s own rules to keep whatever else those characters need: ligatures and alternate forms reachable through layout features, the parts of composite glyphs such as accented letters, kerning pairs between kept glyphs and the .notdef glyph. Everything else is dropped. The engine is compiled to WebAssembly and runs locally.

A worked example

Press Sample to load Geist, a 28.7 KB variable font, with the Basic Latin set selected and the extra text “Hello, world”. Basic Latin is the 95 printable ASCII characters, so the page shows “Characters selected 95 of 95 in this font”. Press Create subset with WOFF2 output. The result is 18.1 KB, 37% smaller, with 152 glyphs kept out of the original 288. The downloaded file is geist-latin-wght-normal-subset.woff2, 18,576 bytes, and the CSS box contains an @font-face rule with unicode-range: U+20-7E plus the weight range of the variable font. The saving is modest because this font is already a Latin-only subset; a font with Cyrillic, Greek and CJK blocks shrinks far more.

Choosing characters

Three sources combine. Tick one or more sets: Basic Latin, Latin-1 for Western European accents, Latin Extended-A for Central European languages, digits and basic symbols, Cyrillic, Greek or common punctuation. Paste text the page will show, which adds exactly those characters. Or type Unicode ranges such as U+0020-007E, U+20AC. The page keeps the union, then intersects it with what the font really has and tells you how many matched. Characters the font lacks are listed so you can pick a different font instead.

Hinting and formats

Remove hinting deletes the TrueType instructions that adjust outlines on low-resolution screens. It makes files smaller, and on modern high-resolution screens the hints matter little, but check the text on the Windows machines you support before removing them. The output can be WOFF2, WOFF, or an uncompressed TTF or OTF. Use WOFF2 for websites. The generated CSS names the format to match your choice.

unicode-range

The unicode-range descriptor tells the browser that this file covers only certain characters, so it downloads the file only when the page uses one of them. Splitting a family into several subsets, for example Latin, Cyrillic and Greek, lets visitors fetch just the part they need. The page writes the range from the characters actually kept, not from the ones you requested.

Edge cases

Fonts whose embedding flags forbid subsetting trigger a warning, and the licence comes before any technical possibility. Open-source licences often allow subsetting but may require a different name for a modified font. Subsetting variable fonts keeps the axes by default, so the file stays flexible. Dynamic content, such as names typed by users, can contain any character, so keep a broad set or a fallback font.

Limits

The tool subsets by characters, not by features or axis ranges. It does not instance a variable font to a single weight. If none of the selected characters exist in the font, the page says so instead of creating an empty file. Nothing leaves your device.

Related tools

• TTF to WOFF2 Converter changes the container without removing glyphs.
• Font Inspector lists the character blocks the font covers.
• @font-face CSS Generator builds the CSS for several faces.
• Variable Font Tester previews the weight range you kept.