Font Converter

What it's for

Change a font between the forms used on computers and on the web. WOFF and WOFF2 are compressed for websites but can’t be installed on most computers; TTF and OTF can. This converts web fonts to installable ones and back, and writes the CSS @font-face rule that loads a font on a web page.

For example, when a designer sends a brand font only as WOFF2 files, convert each to TTF to install it and use it in your documents, if its licence allows.

How to use it

Choose a font file, or drop it on the page: TTF, OTF, WOFF, WOFF2, or a TTC collection (its first font is used).

• Save as TTF or OTF saves an installable font: TTF for fonts with TrueType outlines, OTF for those with PostScript (CFF) outlines, whichever the font has.
• Save as WOFF saves a compressed web font.
• @font-face gives the CSS for the font, with its family name, weight (a range for a variable font) and style filled in. Load the font from (remembered in this browser) chooses whether it points to a file beside the CSS, named after the one you chose, or has the font built into the CSS as a data: address, which needs no extra file but makes the CSS much larger.

Example

Save this site’s own font from this address and open it:

https://toolbox.thoughtasylum.com/assets/fonts/montserrat.woff2

Save as TTF or OTF saves montserrat.ttf (77.7 KB), and Save as WOFF saves montserrat.woff (31.7 KB), against the WOFF2’s 25.9 KB. With The file you chose selected, the CSS is:

@font-face {
  font-family: "Montserrat Thin";
  src: url("montserrat.woff2") format("woff2");
  font-weight: 500 600;
  font-style: normal;
  font-display: swap;
}

Good to know

It can read WOFF2 but not write it: that needs a compressor too large for a page. WOFF2 is the best choice for websites, so keep the original WOFF2 if you have it. Converting doesn’t change the font’s outlines or its licence: check the licence allows installing or self-hosting it. A collection’s other fonts aren’t converted.