Web Font Subsetting & WOFF2 File Size Calculator: Free Web Font Subsetting & WOFF2 File Size Calculator tool: calculate web font file sizes across WOFF2, WOFF, and TTF. Model glyph subsetting byte.
The Inner Architecture of Web Fonts & OpenType Tables
Typography defines the visual identity and reading comfort of modern digital applications. However, unoptimized web fonts are one of the most frequent culprits behind Flash of Invisible Text (FOIT), Flash of Unstyled Text (FOUT), and Cumulative Layout Shift (CLS).
An OpenType (OTF) or TrueType (TTF) font file is not a simple graphics container; it is a structured binary relational database containing dozens of distinct tables:
glyf/CFF: Stores the actual Bezier vector curves outlining every character glyph.cmap: Maps integer Unicode code points to internal glyph index IDs.GPOS: Glyph Positioning table, containing complex kerning pair adjustment matrices.GSUB: Glyph Substitution table, providing ligature rules (e.g. converting "f" + "i" into the unified "fi" ligature) and contextual stylistic sets.hmtx: Horizontal metrics table defining advance widths and side bearings.
The Mathematics of Subsetting: Why Less is More
A commercially purchased desktop font family typically includes 1,500 to 2,500 glyphs to support hundreds of global minority languages, phonetic notation, historical currency symbols, and mathematical operators. If your website is published exclusively in English and Spanish, over 90% of those glyphs are dead weight that users are forced to download on every page view.
Glyph vector data scale linearly with the count of active characters:
Estimated Raw Vector Size $approx N_{text{glyphs}} times (text{Average Curves per Glyph} times 40text{ bytes})$
Basic Latin (95 glyphs): Consumes ~12 KB raw vector data
Full Unicode (2,000 glyphs): Consumes ~220 KB raw vector data
Why WOFF2 Outperforms Legacy Formats
Standard file compression algorithms like gzip (used in WOFF 1.0) treat font tables as arbitrary byte streams. WOFF 2.0 (RFC 8072) revolutionized web font compression by introducing font-specific byte transforms before applying the Brotli compression algorithm:
- Coordinate Delta Transformation: TrueType contour coordinates are converted into normalized difference vectors, creating long sequences of repetitive small integers that Brotli compresses with extreme efficiency.
- Table Directory Optimization: Redundant table tags and offset headers are stripped or combined.
The result is that WOFF2 files are consistently 30% smaller than WOFF 1.0 and up to 75% smaller than original TTF files.
Step-by-Step Worked Numerical Example
Suppose a web developer is optimizing a landing page using Inter Bold:
- Original Desktop Font:
Inter-Bold.ttf= 220 KB (contains 2,240 glyphs) - Target Language: English and Western European (Latin-1 Supplement = 191 glyphs)
- OpenType Features: Retain kerning (GPOS) and standard ligatures (GSUB)
- Target Format: WOFF2
Step 1: Calculate Subsetting Ratio:
Retained Glyphs = 191
Original Glyphs = 2,240
$text{Glyph Retention Ratio} = frac{191}{2,240} approx mathbf{8.5%}$
Step 2: Compute Subsetted Raw Vector & Table Size:
Pruning 91.5% of glyphs reduces the uncompressed vector footprint from 220 KB down to approximately 28 KB.
Retaining kerning and ligatures adds ~6 KB of OpenType tables: $text{Subset TTF} approx mathbf{34text{ KB}}$.
Step 3: Apply WOFF2 Brotli Compression:
WOFF2 typically compresses subsetted TrueType vectors by ~50% to 55%:
$text{Final WOFF2 Size} = 34text{ KB} times 0.48 approx mathbf{16.3text{ KB}}$
$text{Total Byte Savings} = frac{220text{ KB} - 16.3text{ KB}}{220text{ KB}} times 100 = mathbf{92.6%text{ byte reduction!}}$
On a mobile 4G connection (1.6 Mbps), downloading the original 220 KB font required 1.1 seconds of network time, delaying page text rendering. The 16.3 KB subsetted WOFF2 file downloads in just 81 milliseconds, completely eliminating visible layout shifts and text render delay.