Sign up free

Web Font Generator

Turn one font into a web font kit with WOFF2, WOFF, TTF and ready-to-paste @font-face CSS.

Web Font Generator
Coming soon

We’re finishing this tool. Leave your email and we’ll tell you the day it goes live.

About Web Font Generator

A web font generator saves you the fiddly part of self-hosting a font. Upload a TTF or OTF file and you get one ZIP with the font as WOFF2, WOFF and TTF, plus a CSS file with the @font-face rule already written. Put the files on your site, paste the CSS into your stylesheet, and the font is ready to use.

Choose the font-display value for the rule. The recommended swap shows text right away in a fallback font and switches to yours once it has loaded, while auto, block, fallback and optional handle that moment differently. Tick Embed the font in the CSS (Base64) to put the font data inside the CSS itself, which saves a request but makes the stylesheet bigger.

How to use Web Font Generator

  1. 1
    Upload a TTF or OTF

    Choose or drop the font you want to use on your website.

  2. 2
    Choose font-display

    Pick a value from the list. swap is the recommended choice for most sites.

  3. 3
    Decide on Base64

    Tick Embed the font in the CSS (Base64) if you want one CSS file with the font inside.

  4. 4
    Confirm and generate

    Tick the licence box, click Web Font Generator and download the ZIP.

Why use Cubfile for this

  • Three formats, one ZIP

    WOFF2, WOFF and TTF versions of your font, packed together.

  • Ready-to-paste CSS

    The @font-face rule is written for you, with the paths to the font files.

  • font-display control

    Choose swap, auto, block, fallback or optional.

  • Optional Base64 embedding

    Put the font straight into the CSS, handy for small fonts and icon fonts.

FAQ

Web Font Generator: questions and answers

What does the Web Font Generator put in the ZIP?
The font as WOFF2, WOFF and TTF, and a CSS file with an @font-face rule that points to them, using the font-display value you chose. When all you need is the WOFF2, TTF to WOFF2 gives you that single file.
Which font-display value should I pick?
swap suits most sites because text is readable immediately. optional fits speed-focused pages that can live with the fallback font on slow connections, and block hides text briefly until the font arrives.
Should I use Base64 with the Web Font Generator?
Only for small fonts or icon fonts. Base64 saves a request, but it makes the CSS larger and the font can't be cached on its own. For a Chinese, Japanese or Korean font, run Font Subsetter first so only the characters you use are kept.
How often can I use it for free?
Visitors get 2 tasks in total and free accounts 2 per day, with font files up to 50 MB. VIP removes the limit.
Are my fonts and files kept?
No. Everything is deleted one hour after the task. Uploads use HTTPS and each job runs in its own isolated process.
Share Web Font Generator with a friendIt runs in any browser, and they can try it without signing up.

Related tools

TTF Font SubsetterSoonKeep only the characters you use and cut a Chinese font from MBs to KBs.
WOFF2TTF WOFF2 to TTFSoonTurn WOFF2 web fonts back into installable TTF.
OTFTTF OTF to TTFSoonConvert OpenType CFF fonts to TrueType.
TTCTTF TTC to TTFSoonSplit a TrueType collection into separate TTF files.
TTFWOFF2 TTF to WOFF2SoonCompress fonts to WOFF2 for faster web pages.
WOFFTTF WOFF to TTFSoonTurn WOFF web fonts back into installable TTF.
RARZIP RAR to ZIPSoonRepack RAR archives as ZIP so any computer can open them.
7ZZIP 7Z to ZIPSoonRepack 7-Zip archives as ZIP.