Convert TTF to WOFF Online

How to Convert TTF to WOFF Online

1. Upload Your TTF Files: Drag and drop or click "Add Files" to load .ttf font files from your device. Batch is supported — drop in an entire family (Regular, Bold, Italic, Bold Italic, plus weights like Light and Medium) and convert them all in one pass. Parsing happens locally with lazy-loaded opentype.js, so your fonts never leave the browser session.
2. Confirm WOFF as the Output Format: WOFF is preselected as the target. WOFF wraps your TrueType glyf, cmap, hhea, hmtx, and other sfnt tables in a zlib-compressed container per the W3C WOFF 1.0 Recommendation (December 13, 2012). Every glyph, kerning pair, and OpenType feature is preserved bit-for-bit on decode.
3. Review the File List (Optional): Remove any TTF you don't want to convert, reorder for download convenience, or add more files. There are no codec settings to tune — WOFF compression is fully defined by the spec, so output bytes are deterministic for a given input.
4. Convert and Download: Click "Convert" and grab each .woff file individually or as a ZIP for batch jobs. No sign-up, no watermark, no upload to a server. If you need the newer Brotli-compressed format, jump to TTF to WOFF2 instead.

Why Convert TTF to WOFF?

TTF (TrueType Font) is the universal desktop font format — what you install in Windows, macOS, and Linux for use in Word, Photoshop, and the operating system itself. WOFF (Web Open Font Format) is the same font data, but wrapped in a compressed container designed for delivery via CSS @font-face. The W3C explicitly recommends WOFF for serving fonts on the open web, and modern browsers will not load a raw TTF reliably across every platform. Typical reasons to make the conversion:

• Smaller download for the same font — WOFF applies zlib compression at the table level, typically shrinking a TTF by 40-50%. A 168 KB Roboto Regular TTF lands around 85 KB as WOFF, which is real bandwidth savings on a four-weight family.
• CSS @font-face compatibility — Browsers expect format("woff") (or format("woff2")) in the src declaration. Shipping raw TTF works on most modern browsers but is not the documented path per the MDN @font-face reference.
• Legacy browser fallback for WOFF2 — WOFF2 covers ~97% of global traffic per caniuse, but if you still serve IE 11 (some enterprise intranets, kiosks, or government portals) or very old Android Browsers, WOFF is the fallback in your src chain: url("font.woff2") format("woff2"), url("font.woff") format("woff").
• License metadata embedding — WOFF includes an optional XML metadata block where designers and foundries can embed licensing terms, credits, and vendor info without affecting rendering. Useful for self-hosted commercial fonts.
• Document-scoped use, not system-wide install — Per the WOFF spec, decoded WOFF data is isolated to the document that loaded it and cannot be installed as a system font. That matches how foundries license web fonts and is one reason commercial vendors provide WOFF, not raw TTF, downloads.
• Hosting your own fonts instead of Google Fonts — Self-hosting eliminates the third-party DNS lookup, the privacy footprint, and the Cache-Control mismatch that has hurt CWV scores since browser cache partitioning rolled out in 2020.

Already have an OpenType source? Use OTF to WOFF instead. Want to ship only the glyphs your site actually uses? Run Font Subsetter first to drop unused characters before converting, then generate @font-face declarations with the Font-Face CSS Generator.

TTF vs WOFF — Same Font, Different Wrapper

WOFF vs WOFF2 — Which Should You Actually Ship?

Modern guidance from web.dev and MDN is to ship WOFF2 first and add WOFF only as a fallback for the small slice of traffic that needs it. If your analytics show 0% IE 11 sessions, you can drop the WOFF tier entirely.

Frequently Asked Questions

Will my converted WOFF render identically to the TTF source?

Yes. WOFF is a lossless wrapper — zlib compresses the sfnt tables, but the glyf, loca, cmap, hmtx, kern, GSUB, and GPOS tables are preserved byte-for-byte after decompression. Outlines, hinting, kerning pairs, ligatures, and OpenType features all behave exactly as in the original TTF. Per the WOFF 1.0 spec, "properly decoded WOFF files recreate the original font identically to the input file."

Should I serve WOFF or WOFF2 on a modern site?

WOFF2 for everything new. Brotli compression in WOFF2 yields files typically 20–30% smaller than WOFF (median ~24% for TTF-flavored fonts, per the W3C WOFF2 Evaluation Report), and caniuse reports ~97% global support — every browser shipped since 2017 except Internet Explorer 11. Add WOFF as a fallback only if your audience includes IE 11 (enterprise intranets, public-sector kiosks, some education portals). The CSS pattern is:

@font-face {
  font-family: "MyFont";
  src: url("myfont.woff2") format("woff2"),
       url("myfont.woff") format("woff");
}

The browser picks the first format it understands.

How much smaller will my WOFF be compared to the TTF?

Typically 40-50% smaller, depending on how compressible the font's tables are. Latin-only families compress better than CJK fonts with tens of thousands of glyphs (where most of the size is glyph outlines, which don't shrink as dramatically). For reference, Roboto Regular TTF is ~168 KB and lands around 85 KB as WOFF. WOFF2 of the same font is ~53 KB.

Does the conversion preserve OpenType features like ligatures, small caps, and stylistic sets?

Yes. WOFF wraps the entire sfnt table set, including GSUB (substitutions: ligatures, small caps, stylistic alternates), GPOS (positioning: kerning, mark attachment), GDEF, BASE, and MATH tables. Variable font axes (fvar, gvar, HVAR, MVAR, STAT) are also preserved — TTF with variable axes converts to WOFF with the same axes intact, and you can declare it with font-variation-settings after deployment.

Can I install the resulting WOFF as a system font?

No, and that's by design. The WOFF specification requires that decoded font data be "isolated to the document that referenced them" and not made available to other applications or installed system-wide. This is what lets foundries license fonts for web use without users redistributing the underlying TrueType data. If you need a desktop install, keep the original TTF or convert back with WOFF to TTF.

Why is my WOFF still being downloaded by users on slow connections — isn't it cached?

Browser HTTP cache partitioning (Chrome shipped it in 2020; Safari and Firefox followed) means a font file cached on cdn.example.com is no longer shared across sites that all loaded it from there. Self-hosting under your own origin with a long Cache-Control: max-age=31536000, immutable header is now the recommended pattern, and shipping a smaller WOFF2 (or subset WOFF2 with only the glyphs you use) is the highest-impact lever. Run Font Subsetter to strip glyphs you don't need before converting.

Does the converter add any tracking, watermark, or "Pro" gating?

No. Conversion runs entirely in your browser via opentype.js; no file is uploaded to a server, there's no account requirement, no watermark, no file-count cap, and no hidden tier. The output .woff is byte-identical to what you'd get from any spec-compliant TTF→WOFF tool, because WOFF compression is fully defined by the W3C Recommendation rather than left up to the encoder.

What if I have an OTF source instead of TTF?

OTF (OpenType) and TTF are both sfnt-based, but OTF typically uses CFF (PostScript) outlines instead of TrueType outlines. WOFF wraps either, so the conversion path is the same — use OTF to WOFF. If you've inherited a mixed bag of .ttf and .otf files for the same family, convert each in its respective tool; the resulting WOFFs declare their internal flavor and browsers handle them identically via @font-face.

Do I need to convert all four weights and styles, or just the regular?

Convert every weight/style you actually use in CSS. Each @font-face block targets one combination of font-weight and font-style, and the browser does NOT synthesize bold or italic from the regular unless you tell it to (and the synthetic versions look noticeably worse than real designed cuts). For a typical body-text family that means at minimum Regular 400, Italic 400, Bold 700, and Bold Italic 700 — four files. Variable fonts collapse this back to one file at the cost of a slightly larger initial download.