svg2all

@font-face generator

Writes the @font-face rule for a font file – family, weight, style and unicode-range read from the font.

Runs in your browser – your file is never uploaded

Loading tool …

Frequently asked questions

Is my file uploaded?

No. The conversion runs entirely in your browser. The file never leaves your device – there is no server that could see it. Once the page has loaded, the tool even works offline.

Where do family, weight and style come from?

From the font itself: the family name from its name table (the typographic family if present), the weight from the OS/2 weight class (400 = normal, 700 = bold), the style from the italic and oblique flags, the width from the width class. The src line uses your file's name and the right format() keyword – woff2, woff, truetype or opentype.

Should I embed the font as base64?

Usually not. A data URL saves one request but makes the CSS a third larger than the font, blocks rendering until the whole stylesheet has arrived and cannot be cached on its own. Embedding makes sense for a single-file demo or an e-mail template, not for a normal website.

What is unicode-range for?

It lists exactly the characters the font contains. Browsers then download the font only if the page actually uses one of them – with a subset per script you can serve just the piece a page needs. The value is read from the font's character map, so it is always accurate for this file.