Tutorial·6 min read

TTF vs WOFF2 vs OTF — Which Font Format Should You Use?

A plain-English guide to font formats: TTF, OTF, WOFF, and WOFF2. When to use each, how they differ in file size and browser support, and which format to download.

CS
Cleffon Design Studio

Designers & builders of Typescope


When you click "Download" on a font, you're often given a choice: TTF, WOFF2, WOFF, or OTF. They all contain the same typeface, so which one should you pick? The answer depends on where you're using the font.

TTF — TrueType Font

Best for: desktop use, apps, documents, video editors, print

TTF is the original digital font format, created by Apple and Microsoft in the late 1980s. It works everywhere: macOS, Windows, Linux, iOS, Android, Figma, Photoshop, Illustrator, Word, Premiere, and virtually every other application. When in doubt, download TTF — it has the broadest compatibility of any format.

Downside: TTF files are larger than WOFF2, so they're not ideal for serving on a website where page speed matters.

OTF — OpenType Font

Best for: desktop use when you need advanced features (ligatures, small caps, stylistic alternates)

OTF is a joint format by Adobe and Microsoft that extends TrueType. Most professional fonts (from Klim, Grilli Type, Commercial Type) ship as OTF because it supports advanced OpenType features. For everyday desktop use, TTF and OTF are interchangeable in modern apps.

WOFF2 — Web Open Font Format 2

Best for: embedding on websites

WOFF2 is a compressed web font format. The same font file can be 30–50% smaller than its TTF equivalent, which matters for page load speed. WOFF2 is supported in all modern browsers (Chrome, Firefox, Safari 12+, Edge). Use WOFF2 in your @font-face CSS declarations.

WOFF — Web Open Font Format

Best for: web with legacy browser support

WOFF is the predecessor to WOFF2 — less compressed but supported in older browsers going back to IE9. If your audience might be on old browsers, include WOFF as a fallback alongside WOFF2. Otherwise, skip it.

Quick decision guide

  • Installing on your Mac or PC → TTF or OTF
  • Using in Figma, Sketch, or Adobe apps → TTF or OTF
  • Embedding on a website → WOFF2 (with WOFF fallback for legacy)
  • Mobile app development → TTF or OTF
  • Video / motion graphics → TTF or OTF

How to download in the right format

In Typescope, each font card has a Download button. For Google Fonts and Fontshare fonts, click the small arrow (▾) next to "Download" to choose your format. TTF is the default. All downloads go directly from the font CDN to your device — no middleman, no login.


Typescope

Test your fonts live in Typescope

Instantly preview 6,000+ local system fonts and Google Fonts side-by-side with custom text, variable weight axes, and one-click TTF downloads.

Launch Typescope Studio →

More Articles from Typescope

View all articles →