DEV Community

Benjamin Black
Benjamin Black

Posted on • Edited on

Converting TTF fonts to WOFF2 (and WOFF)

My posts are usually notes and reference materials for myself, which I publish here with the hope that others might find them useful.

Fonts obtained from foundries, including Google Web Fonts, often do not include font files in the web font format WOFF2, even when the font face is specifically licensed for use on the web; often the fonts are only provided in TrueType (.ttf) format.

Fortunately, it is not difficult to "convert" (really, just encoding and compressing) font files from TTF format to WOFF2, without relying on sketchy online services.

Google maintains free software (MIT) command-line utilities to compress and decompress WOFF2 files. The repository contains instructions to build and run the utility; but for redundancy's sake...

Build:

git clone --recursive https://github.com/google/woff2.git
cd woff2
make clean all
Enter fullscreen mode Exit fullscreen mode

Run:

woff2_compress myfont.ttf
Enter fullscreen mode Exit fullscreen mode

If supporting IE is necessary, ttf2woff is a free software (MIT) legacy library available in NPM and is similarly easy to use:

$ npx ttf2woff myfont.ttf myfont.woff
Enter fullscreen mode Exit fullscreen mode

Top comments (2)

Collapse
 
pierreneter profile image
Pierre Neter • Edited

In fact, Google does not use this tool for their website fonts.google.com, they use github.com/fonttools/fonttools (added in github.com/googlefonts/gftools) to convert the fonts to .woff and .woff2 formats.