A free font converter: open any of 9 formats (TTF, OTF, WOFF, WOFF2, EOT, DFONT, SUIT, BIN or Type 42) and save it as any of the 21, trimmed to only the characters you need. The new file is loaded by your browser and read back before you download it, and nothing leaves this tab.
@font-face {
font-family: "My Font";
src: url("/fonts/font.woff2") format("woff2");
font-weight: 400;
font-style: normal;
font-display: swap;
}A full font can hold thousands of glyphs; an English page uses under 200. Open a font to see its own counts.
We converted one real typeface into every format we can measure end to end and checked that no glyphs were lost: Akrobat ExtraBold, a 70.4 KB TrueType with 485 glyphs covering 432 characters, converted with fontTools 4.63. That test covers 7 formats; the button below writes all 21 from the font open above, right here, and checks each file.
straightenMeasure all 21 on the fontAll 21 are saved right here, and every saved file is read back before you download it. Ten open here too: the desktop and web fonts, the Mac suitcases and Type 42. SVG fonts are recognised but not reopened, because browsers no longer draw them.
TrueType and OpenType share one container, the sfnt. The file opens with a version tag, then a directory with one 16-byte record per table: a four-letter tag, a checksum, an offset and a length. The records are sorted by tag so a font engine can binary-search them, which is what the odd-looking searchRange fields are for. Choose the outline type and optional tables and the header below is rebuilt.
Since OpenType 1.8, a font can store design axes in its fvar table and the differences between masters in gvar or CFF2. Literata has two registered axes: weight, and optical size, which changes the letter shapes for small or large text rather than just scaling them. The sample below is the real variable font, set with font-variation-settings in your browser.
@font-face {
font-family: "Literata";
src: url("literata-var.woff2")
format("woff2") tech(variations);
font-weight: 200 900;
}
h1 {
font-weight: 400;
font-optical-sizing: auto;
}
Signatures, media types and limits from the OpenType 1.9 specification, W3C WOFF and WOFF2 and RFC 8081. The last column asks this browser whether it accepts each format in @font-face.