If you're serving TTF fonts on your website, you're sending roughly 30% more data than you need to. WOFF2 delivers the exact same typeface in a significantly smaller file, and every modern browser supports it. Here's how to convert — and why it matters for your site's performance.
Why WOFF2?
WOFF2 (Web Open Font Format 2.0) uses Brotli compression to shrink font files by approximately 30% compared to TTF, without any loss in quality. The font glyphs, hinting, kerning, and all typographic features are preserved identically. When a browser loads a WOFF2 file, it decompresses it to the same data as the original TTF.
The performance impact is real. Fonts are render-blocking resources — the browser won't paint text until fonts finish loading. A 120KB TTF that becomes an 84KB WOFF2 means text appears faster, especially on mobile connections. Google's Core Web Vitals directly measure this: smaller fonts improve Largest Contentful Paint (LCP) and reduce Cumulative Layout Shift (CLS) from font swaps.
Browser support is universal. Chrome, Firefox, Safari, and Edge all support WOFF2. The only browsers that don't are Internet Explorer and very old Android browsers — both well below 1% of global traffic.
How to convert
Using WOFF2 in CSS
Once you have your WOFF2 file, reference it in your stylesheet. List WOFF2 first with a TTF fallback for maximum compatibility:
@font-face {
font-family: 'MyFont';
src: url('/fonts/myfont.woff2') format('woff2'),
url('/fonts/myfont.ttf') format('truetype');
font-display: swap;
}The font-display: swap directive tells the browser to show fallback text immediately and swap in the custom font once it loads, eliminating invisible text during font loading.
Font license compliance
Many commercial font licenses include clauses that restrict uploading font files to third-party web services. This creates a problem: you need to convert to WOFF2 for performance, but most conversion tools require uploading the font to a server.
Of course, always check the specific terms of your font license. But the local-only nature of Morph's conversion eliminates the most common compliance concern.
Other font conversions
Morph also supports OTF to WOFF2, WOFF to WOFF2, TTF to OTF, and every other combination of TTF, OTF, WOFF, and WOFF2. Need free fonts to start with? Browse 1,500+ free fonts in the Morph font library.