Convert TTF to WOFF in your browser
WOFF is the older web font wrapper, and most people who need one need it because something refuses to accept anything else. This writes a valid WOFF from your TrueType file without uploading it, and tells you when WOFF2 would have been the better answer.
or browse your device. Everything is processed on this device
No TTF to hand?
The .ttf is still loaded in this tab. If the WOFF was habit rather than a validator, WOFF2 is the same font about a fifth smaller, and every browser you can name reads it.
Convert the TTF to WOFF2 insteadHow to convert a TTF to WOFF
The font is read and rewrapped in this tab. Nothing is uploaded, which matters if the typeface is licensed to you rather than published.
A straight WOFF of the whole font is what most uploaders are expecting. Narrow it only if you know which characters the site renders.
The result note says what the wrapper did and what, if anything, came out of the font on the way through.
If you control the CSS, list woff2 before woff in the same @font-face rule. Browsers take the first format they understand, so modern ones never fetch the larger file.
When a WOFF is still the right file
WOFF is a container, not a font format. It takes the sfnt table directory out of a TTF, compresses each table on its own with zlib, and writes the lot after a 44 byte header. Nothing is redrawn and no data is discarded, which is why unwrapping a WOFF gives back the TrueType font it was made from, byte for byte in the tables that matter. It landed in browsers around 2010 and was the first web font format that both foundries and browser vendors would agree to.
WOFF2 replaced it in 2016 by compressing the whole font with brotli rather than each table with zlib, and by rearranging the glyph table before it does so. On the same font that is roughly another fifth off, and support is now universal outside IE11 and Android 4. So the honest position is that WOFF is a fallback format, and on most sites it is a fallback for browsers that no longer visit.
What keeps this conversion useful is software rather than browsers. Theme and template marketplaces validate uploads against a list of extensions somebody wrote years ago. Older WordPress and Shopify font managers accept .woff and reject .woff2. Some design tools export CSS that references WOFF. Email builders and internal design systems inherit those rules and nobody revisits them. In every one of those cases the file has to be a WOFF because a validator says so, and the argument about brotli is not one you can have with a form.
If you do control the stylesheet, you do not have to choose. One @font-face rule can list several sources, and the browser uses the first format it recognises: put the WOFF2 first, the WOFF second, and every visitor gets the smallest file their browser can read. The only cost is that both files sit on your server.
TTF to WOFF FAQ
Should I use WOFF or WOFF2 on a website?
WOFF2, unless something in your stack will not take it. It is the same font in a better wrapper, about a fifth smaller than WOFF, and supported by every browser released since 2016. WOFF is worth writing when an uploader, theme or plugin refuses the newer extension, or when you are listing it as a second source in the same @font-face rule for very old browsers.
Is TTF to WOFF lossless?
Yes, with the range left on All. WOFF stores the same tables the TTF held, each zlib compressed, and a table that does not compress is stored raw. Nothing is redrawn or renumbered, so unwrapping the WOFF gives back the font you dropped in. Narrowing the character range or dropping hinting makes it lossy on purpose, and the result panel says exactly what went.
How much smaller is a WOFF than the TTF?
Usually about half, though it depends entirely on the font: outline data compresses well and hinting compresses very well, so a heavily hinted face gains more. The sample font on this page goes from 760KB to 386KB. The same font as WOFF2 comes out at 307KB, which is the fifth you are giving up by using the older container.
Which browsers support WOFF?
Everything from IE9 onward, plus Firefox 3.6, Chrome 6, Safari 5.1 and Android 4.4. That reach is the entire reason the format still exists. WOFF2 covers everything except IE11 and Android 4, so the gap between them is a slice of traffic most sites can no longer measure.
Can I serve WOFF and WOFF2 from one @font-face rule?
Yes, and it is the right way to ship both. List them in one src, most modern first: src: url("f.woff2") format("woff2"), url("f.woff") format("woff"). The browser takes the first format it understands and never downloads the other, so modern visitors get brotli and old ones still get a font.
Does converting a font to WOFF let me use it on my site?
Only if the licence already did. Webfont rights are usually sold separately from desktop ones, and a converted file is the same typeface under the same terms: changing the wrapper changes nothing about what you are allowed to do with it. Open licences such as the SIL OFL cover web use. The licence records in the font are never stripped here.
Are my TTF files uploaded to convert them?
No. The TTF is decoded and the WOFF is written by your own browser, in this tab. There is no upload endpoint in the site for a file to go to, which you can check in your network tools: convert something and watch that no request carries it. Disconnect from the network after the page loads and it still works.
Related
Same format joins the queue. Anything else re-routes to its own tool.