Skip to content
justyourconvert

OTF to WOFF2 Converter

Compress an OpenType font into a fast-loading web font.

  • 100% Free
  • No Sign Up
  • Nothing Uploaded

OTF to WOFF2

Compress an OpenType font for the web

Drag & drop a font

or click to browse. You can also paste.

OTF, up to 20 MB.

Best for websites: the smallest file, supported by every current browser.

Size-

Processed on your device. Nothing is uploaded.

More converters

View all tools

Every format, one private converter.

No software. No uploads. No sign-up.

Browse all 96 tools
Files uploaded
0
Free tools
96
In your browser
100%

How to convert OTF to WOFF2

Three steps, all in your browser.

  1. 1

    Add a font

    Drop a TTF, OTF, WOFF or WOFF2 file.

  2. 2

    Check the preview

    The converted font is loaded and shown with your own text.

  3. 3

    Download

    Save the font in its new format.

OTF to WOFF2 Converter: what to know

OTF fonts with CFF outlines are common among professional and open-source type families, and they work on the web once packed as WOFF2. WOFF2 compresses the font with Brotli, so it downloads faster, and every current browser supports it. This converter does the packing in your browser using Google's reference WOFF2 encoder compiled to WebAssembly, so the font is never uploaded.

The outlines aren't converted: WOFF2 stores CFF outlines as they are, along with their hinting, kerning and OpenType features, and the browser unpacks an identical font. TrueType fonts get extra savings from WOFF2's compact glyph encoding, which doesn't apply to CFF, so expect OTF fonts to shrink somewhat less than TTF fonts, though still noticeably.

As with any web font, make sure the font's license allows web embedding. Variable fonts with CFF2 outlines are packed as they are too, but font collections (.otc) aren't supported.

Popular uses

  • Self-hosting an OpenType family on a website
  • Replacing large OTF downloads in a web app with WOFF2
  • Packing a brand font for use in HTML emails or landing pages that support web fonts

Tips for the best result

  • Use one @font-face per weight: @font-face { font-family: "Brand"; src: url("brand-bold.woff2") format("woff2"); font-weight: 700; }.
  • Add font-display: swap so text stays visible while the font loads.
  • Preload only the one or two fonts used above the fold; preloading every weight slows the page down.
  • Subsetting a font to the characters you need shrinks it further; do that before converting.

Read how JustYourConvert works and our privacy details. Keep your original files and check a converted file before you replace anything.

Frequently asked questions