What Is a WOFF File? A Plain Guide

What Is a WOFF File? A Plain Guide

If you have ever saved fonts from a website or looked inside a WordPress theme, you have probably seen files ending in .woff. They look like fonts, but your computer will not install them. So what is a WOFF file? This guide explains it in plain words: what it is, why it exists, what is inside and how to open one.

WOFF in one sentence

A WOFF file is a font packed for websites, so it downloads faster and carries information about who made it.

WOFF stands for Web Open Font Format. The file extension is .woff. A newer version, WOFF2, uses the extension .woff2.

Why WOFF was created

Before WOFF, websites could only use fonts that were already installed on your computer. That is why so many old websites used Arial, Times New Roman or Verdana. Designers wanted more choice.

Browsers could load TTF and OTF fonts from a website, but that caused two problems:

  1. File size. Desktop fonts are not compressed. They made pages slow to load.
  2. Licensing. Font makers did not like their full desktop fonts sitting on web servers where anyone could grab and install them.

WOFF solved both. It compresses the font, so it is smaller. And because it is a web format that desktop systems do not install, a WOFF file is less tempting to copy and use as a desktop font. It also has room for license notes inside the file.

The format was created in 2009 by Jonathan Kew of Mozilla, Tal Leming of Type Supply and Erik van Blokland of LettError. Firefox 3.6 was the first browser to support it, in 2010. The W3C, the group that sets web standards, made WOFF an official recommendation in December 2012.

What is inside a WOFF file?

A WOFF file is a wrapper around a normal font. Think of it like a ZIP file that holds exactly one font, plus a few notes.

Inside you will find:

PartWhat it holds
HeaderThe WOFF signature, the font type and sizes
Table directoryA list of the font’s parts and where each one sits
Font tablesThe actual font: shapes, spacing, names and more, each compressed
Metadata (optional)Notes about the font, like the designer and license, in XML
Private data (optional)Extra data only the font maker uses

The font tables are the same tables you would find in a TTF or OTF file. They include the glyph outlines, the character map, the name table and the spacing data. WOFF just compresses each table with zlib, the same compression used in ZIP and PNG files.

That is why converting a WOFF file back to TTF or OTF is lossless. You unpack the tables and get the original font back. See how to convert WOFF to TTF for the steps.

What the metadata block is for

The optional metadata block is a small XML note stored inside the WOFF file. Font makers can use it to record things like:

  • The name of the font maker and their website
  • A description of the font
  • The license, with a link to the full terms
  • Credits for the designers who worked on it

Browsers ignore this block when they draw text. It is there for people and tools that want to know where a font came from. In practice, many WOFF files leave it empty. The same details often live in the font’s own name table, which is what our viewer reads.

How to recognize a WOFF file

  • The file name ends in .woff.
  • The first four letters inside the file are wOFF. You can see them if you open the file in a text editor. The rest looks like gibberish, because it is compressed.
  • On a web server, it is sent with the type font/woff.

If the file ends in .woff but starts with HTML tags, it is not a font. It is usually an error page saved with the wrong name.

WOFF vs TTF vs OTF vs WOFF2

These four formats cause a lot of confusion. Here is how they compare.

FormatMade forCompressed?Install on PC or Mac?
TTF (TrueType)Desktop and printNoYes
OTF (OpenType)Desktop and printNoYes
WOFFWebsitesYes (zlib)No
WOFF2WebsitesYes (Brotli, smaller)No

In short: TTF and OTF are for your computer. WOFF and WOFF2 are for websites. WOFF2 is the newer web format and produces smaller files. Our guide on WOFF vs WOFF2 compares the two web formats in detail, and what is a WOFF2 file covers the newer one.

How websites use WOFF files

A website tells the browser about its fonts with a CSS rule called @font-face. It looks roughly like this:

@font-face {
  font-family: "MyFont";
  src: url("myfont.woff2") format("woff2"),
       url("myfont.woff") format("woff");
}

The browser picks the first format it supports. Modern browsers take WOFF2. Older ones fall back to WOFF. The browser downloads the file, unpacks it in memory and uses it to draw the text. It never installs the font on your computer.

That is why you might find WOFF files in your browser cache or in a website’s folder, but never in your system’s font list.

Which browsers support WOFF?

All modern browsers support WOFF: Chrome, Edge, Firefox, Safari and Opera, on desktop and mobile. Even Internet Explorer 9 supported it. Today, support is universal. WOFF2 is almost as widely supported and is the usual first choice for new websites.

How to open a WOFF file

Your computer’s font tools will not open WOFF files. Windows Font Viewer and Mac Font Book only handle desktop formats. But your browser can read them, so a browser-based viewer is the easiest option.

  1. Go to openwofffile.com.
  2. Drop the WOFF file on the pink box.
  3. See the preview, font name, style, license and every glyph.

Nothing is uploaded. The file is read on your device.

Try it: Open a WOFF file now and see what is inside.

For platform-specific help, see how to open WOFF files on Windows and how to open WOFF fonts on a Mac.

Can you install a WOFF font?

Not directly. Windows and macOS only install TTF and OTF. To use a WOFF font in Word, Photoshop or other apps, convert it to TTF first, then install it. The free converter does this in one click. For details, read how to install a WOFF font on Windows.

Is a WOFF file safe?

Yes, in normal use. A WOFF file is font data, not a program you run. Browsers load millions of WOFF files every day, and they check web fonts carefully before using them. As with any file, only install fonts on your computer from sources you trust.

Where do WOFF files come from?

You will usually find WOFF files in these places:

  • Website folders, like a WordPress theme’s fonts folder
  • Font download bundles, which often include web versions next to TTF and OTF
  • Icon font packs, such as older versions of Font Awesome
  • Your browser, if you saved fonts using developer tools

Many WOFF files from websites are cut down to one language or to the characters a site needs. That keeps them small but means they may miss letters. If you see boxes when typing, read why WOFF fonts show boxes.

Is WOFF still used?

Yes, but less than before. Most new websites use WOFF2, because it is about 30% smaller on average. Many sites still include WOFF as a backup for very old browsers, and many older themes only ship WOFF. You will keep running into WOFF files for years.

Is WOFF free to use?

The format itself is an open standard. Anyone can create, read or support WOFF files without paying a fee. The fonts inside are a different story. Each font has its own license. Some are free, like fonts under the SIL Open Font License. Others are paid. Check the license in the font before you reuse it.

Common questions

How do you pronounce WOFF?

Most people say it like “woof”, the sound a dog makes. Some spell it out, W-O-F-F. Both are understood.

Can I open a WOFF file in Word?

No. Word uses installed fonts. Convert the WOFF file to TTF, install it, then pick it in Word.

Is WOFF a vector format?

The glyphs inside are vector outlines, just like in TTF and OTF. That is why web fonts stay sharp at any size.

Can I edit a WOFF file?

Yes, with a font editor like FontForge or with fontTools. See how to edit a WOFF file.

What is the difference between a font and a typeface?

A typeface is the design, like Helvetica. A font is a specific file or weight of that design, like Helvetica Bold in a WOFF file. People use the words loosely, and that is fine.

Summary

A WOFF file is a normal font, compressed and wrapped for websites. It loads faster than TTF or OTF and can carry license notes. Browsers use it, but your computer cannot install it. To look inside one, drop it into a free WOFF viewer. To use it in desktop apps, convert it to TTF and install it.

Similar Posts

One Comment

Leave a Reply

Your email address will not be published. Required fields are marked *