In this article
Web font formats have been in a slow consolidation for a decade. In the early days of web fonts, developers had to ship four or five separate font files to cover the browser matrix: EOT for Internet Explorer, SVG fonts for old Safari, TTF for Android, WOFF for modern browsers, and later WOFF2 for browsers that could handle Brotli compression. Build tools like Font Squirrel and Google Fonts normalized the practice of generating all formats simultaneously, and the pattern became muscle memory — even as browser support shifted dramatically beneath it.
The landscape in 2026 is completely different. Chrome added WOFF2 support in version 36, released in 2014. Firefox followed in 2015, Edge in 2016, and Safari in 2018. The sole holdout, Internet Explorer 11, was officially discontinued by Microsoft in June 2022 with support formally ending in January 2023. The result is that WOFF2 now commands 97%+ browser support globally, making it effectively universal for any site that cares about analytics-driven browser targeting.
Yet a significant share of production sites still ship multi-format font bundles with WOFF, EOT, and even SVG font fallbacks intact. This article documents where browser support stands today, explains why the old formats persist, and gives you a concrete checklist to migrate to WOFF2-only delivery.
WOFF2 Browser Support in 2026
According to caniuse.com data tracked through early 2026, WOFF2 has crossed the 97% global usage threshold. This figure accounts for browsers in active use — not just installs — and is weighted by real-world traffic distribution across regions. The number is even higher in North America, Western Europe, and East Asia, where older browser versions have been more thoroughly replaced by auto-updating modern browsers.
The WOFF2 specification was developed by Google engineers and submitted to the W3C, building on the earlier WOFF format by swapping zlib compression for a custom Brotli-based preprocessing pipeline designed specifically for font data. Chrome was naturally the first to ship support, followed by Firefox and eventually Safari — which has historically been slower to adopt newer web standards. Edge gained WOFF2 support when it moved to the Chromium engine. The only meaningful holdout has been IE11, which now accounts for less than 0.3% of global browser usage and has received no security updates since January 2023.
| Browser | WOFF2 Since Version | Year | Notes |
|---|---|---|---|
| Chrome | v36 | 2014 | First browser with WOFF2 support |
| Firefox | v39 | 2015 | Added via W3C spec implementation |
| Edge (Chromium) | v14 | 2016 | EdgeHTML era; Chromium Edge since 2020 |
| Safari | v12 | 2018 | Last major holdout before IE11 |
| Chrome for Android | v36+ | 2014 | Full parity with desktop Chrome |
| Safari on iOS | v12 | 2018 | Tracks desktop Safari releases |
| Internet Explorer | Never | — | Discontinued Jan 2023; <0.3% usage |
Mobile Support Is Equally Comprehensive
Mobile browser support mirrors desktop. Chrome for Android has matched desktop Chrome since version 36. Safari on iOS tracks desktop Safari releases and gained WOFF2 in iOS 12 (2018). Samsung Internet, Opera Mobile, and Firefox for Android all support WOFF2. The only mobile gap is very old Android WebView instances (pre-Android 5.0), which represent a negligible fraction of real-world traffic in 2026.
WOFF2 vs. Older Font Formats
The technical case for WOFF2 is not just about browser support — it is about compression quality. WOFF2 was engineered from the ground up for font data, applying a multi-stage pipeline that first preprocesses the raw OpenType tables to improve compressibility, then applies Brotli compression. WOFF, by contrast, uses standard zlib (the same algorithm as gzip), which achieves decent but not exceptional compression on font binary data. EOT uses Microsoft's LZW-derived compression, which predates modern algorithms by decades and produces the worst results of the three formats.
The preprocessing step in WOFF2 is particularly significant. Before compressing, the encoder applies font-specific transformations: it reorders glyph table data to expose repetition patterns, delta-encodes coordinate sequences in TrueType outlines, and reorganizes kerning and layout table data into more compressible structures. This means a WOFF2 file is not simply "the same TTF with Brotli on top" — the internal representation is meaningfully different and significantly more compact than anything Brotli alone could achieve on raw font binary data.
| Format | Compression | Typical Size (100KB TTF baseline) | Browser Support |
|---|---|---|---|
| TTF / OTF | None | 100KB | Universal (all browsers) |
| EOT | LZW (legacy) | ~55KB | IE only — effectively zero usage |
| WOFF | zlib (gzip-level) | ~65KB | 97%+ (same as WOFF2) |
| WOFF2 | Brotli + preprocessing | ~40KB | 97%+ (all modern browsers) |
Real-World Numbers: Inter Regular
As a concrete example, the Inter Regular typeface — one of the most-used web fonts today — weighs approximately 310KB as a TTF, 97KB as WOFF, and 72KB as WOFF2. That is a 26% reduction from WOFF to WOFF2, and a 77% reduction from the raw TTF. For a site loading four font variants (Regular, Bold, Italic, Bold Italic), switching from TTF to WOFF2 saves over 900KB of font transfer per page load. The savings compound further when combined with subsetting.
Why WOFF Still Exists in the Same Support Tier
WOFF and WOFF2 have essentially identical browser support in 2026 — both sit at 97%+. The browsers that support one support the other. This means WOFF provides no additional coverage: every browser that would fall back to WOFF already supports WOFF2 and will use it first. The WOFF fallback in a multi-format @font-face block is never reached by any meaningful share of real-world traffic.
Why Sites Still Serve WOFF and EOT
If the case for WOFF2-only is so clear, why do so many production sites still ship multi-format font bundles? The answer is largely inertia, tooling defaults, and a persistent misconception that keeping fallbacks is "free." None of these reasons hold up under scrutiny.
Legacy CSS Templates and Starter Kits
A huge proportion of @font-face rules in production were written years ago and copy-pasted from CSS resets, boilerplate kits, or Font Squirrel's "expert" generator output. The classic Fontspring bulletproof syntax — which included src: url(font.eot) as the first line — was the de facto standard from 2009 to 2016. Many codebases simply have never had these blocks revisited since the original implementation.
CMS Themes and Plugin Authors
WordPress themes, Shopify themes, and third-party UI kits commonly ship their own bundled font files. These themes are often written once and maintained infrequently. A theme that shipped in 2018 with multi-format fonts will continue serving those formats to every site using it until the theme author pushes an update — which may never happen. Plugin-loaded fonts (sliders, page builders, icon sets) add another layer of legacy font delivery that site owners cannot easily override.
Build Tools with Multi-Format Defaults
Font processing tools — including older versions of webfont-generator, fonttools scripts, and some Webpack font loaders — default to outputting TTF, WOFF, and WOFF2 simultaneously. Without conscious configuration, every build pipeline that touches font files tends to regenerate the full format set. Developers who set up the pipeline once and move on end up serving formats they never intended to maintain long-term.
The "Fallbacks Are Free" Misconception
A common assumption is that serving extra font formats costs nothing if browsers simply ignore them. This is incorrect on several levels. First, every additional font file increases CDN storage, which has non-trivial costs at scale. Second, it increases the surface area for cache invalidation bugs — if a WOFF2 and WOFF version of the same font have different cache headers or different content hashes, they can cause inconsistent rendering across requests. Third, bloated @font-face blocks are harder to audit and maintain, making font optimization work more error-prone over time.
The Real Cost of Unused Fallbacks
- Larger build output and deployment artifacts
- Increased CDN storage costs across multiple format files
- More complex
@font-faceblocks that are harder to audit and review - Expanded surface area for cache inconsistency bugs between format variants
- Developer confusion when debugging font loading — more files to trace in DevTools
Migration Checklist: Convert to WOFF2-Only
Migrating to WOFF2-only delivery is a straightforward process that takes an hour or less for most projects. The steps below cover the full migration from audit through verification.
Audit Your Current Font Files
Search your project for all font file extensions: .eot, .ttf, .otf, .woff, and .woff2. In a terminal, run find . -name "*.eot" -o -name "*.woff" -o -name "*.ttf" from your project root. Document every file found — its location, its font name, and whether a WOFF2 version already exists alongside it.
Convert TTF and OTF Files to WOFF2
For any font where you only have a TTF or OTF file, convert it to WOFF2. Use our Font Converter tool to convert files directly in your browser without installing anything. Alternatively, install the woff2 command-line tool from Google (woff2_compress font.ttf) or use the Python fonttools library with pyftsubset. Verify the output file is smaller than the source — if it is not, the source may already be compressed.
Update @font-face Rules to WOFF2-Only
Replace all multi-format @font-face blocks with a clean WOFF2-only declaration. The before and after comparison is significant:
/* BEFORE — legacy multi-format block */
@font-face {
font-family: 'MyFont';
src: url('/fonts/myfont.eot');
src: url('/fonts/myfont.eot?#iefix') format('embedded-opentype'),
url('/fonts/myfont.woff2') format('woff2'),
url('/fonts/myfont.woff') format('woff'),
url('/fonts/myfont.ttf') format('truetype'),
url('/fonts/myfont.svg#MyFont') format('svg');
font-weight: 400;
font-style: normal;
font-display: swap;
}/* AFTER — clean WOFF2-only block */
@font-face {
font-family: 'MyFont';
src: url('/fonts/myfont.woff2') format('woff2');
font-weight: 400;
font-style: normal;
font-display: swap;
}Remove Old Format Files
Once your CSS is updated and tested, delete all .eot, .woff, and unnecessary .ttf files from your project. If your source font is a TTF or OTF from the font foundry, keep it in a non-served assets folder as the source of record — but do not deploy it to your CDN or public directory. Only the WOFF2 file should be in your public-facing font path.
Verify in Browser DevTools
Open Chrome DevTools and navigate to the Network tab. Filter by "Font" and reload the page. Confirm that only .woff2 files are being requested — no WOFF, TTF, or EOT requests should appear. Then open the Application tab, look under Cache Storage or check the Sources panel to verify no stale old-format files are being served from a previous deployment. Use the Coverage tab to confirm fonts are being used, not just loaded.
Tip: Check Third-Party Fonts Too
Do not overlook fonts loaded by third-party scripts — analytics widgets, chat widgets, embedded maps, and UI libraries all sometimes bundle their own fonts. Use the DevTools Network font filter with throttling enabled to see every font request, including those from cross-origin CDNs. You cannot always control third-party font formats, but identifying them lets you raise issues with vendors or replace outdated dependencies.
What to Do Now
The migration steps above are straightforward, and our free tools handle the most time-consuming parts automatically. Here is where to start based on your situation:
Convert TTF / OTF / WOFF to WOFF2
Upload your existing font files and download WOFF2 versions instantly. No installation required — works directly in the browser for files up to several MB.
Open Font Converter →Generate Clean @font-face CSS
Use our CSS Generator to produce correct, minimal @font-face blocks with WOFF2-only src declarations, proper font-display settings, and optional unicode-range subsetting.
Analyze Your Existing Fonts
Not sure what format your fonts are actually in, or what tables they contain? The Font Analyzer inspects any uploaded font file and reports its format, glyph count, OpenType feature support, and metadata — helping you decide what to convert and what to discard.
Open Font Analyzer →WOFF2 Browser Support FAQs
Common questions about WOFF2 adoption, format migration, and compression
Related Resources
WOFF vs. WOFF2 Comparison
Side-by-side comparison of compression, browser support, and use cases for both web font formats.
Read comparison →WOFF2 Format Deep Dive
Technical breakdown of the WOFF2 specification, Brotli preprocessing pipeline, and table transformation algorithms.
Read guide →Web Font Optimization Guide
Complete guide to subsetting, font-display strategies, preloading, and Core Web Vitals impact of web fonts.
Read guide →CSS @font-face Generator
Generate clean, modern @font-face declarations with WOFF2-only sources and proper font-display settings.
Open tool →Written & Verified by
Sarah Mitchell
Product Designer, Font Specialist
Convert to WOFF2 Now
Drop your TTF, OTF, or WOFF files into our converter and get optimized WOFF2 files in seconds. Then generate clean @font-face CSS ready to paste into your project.
