What is MIME type "font/woff"?

A MIME type is a string that tells browsers and other tools how to handle a particular kind of file.

The MIME type font/woff is used for web fonts. It tells browsers they are handling a compressed font file from the WOFF format.

This format speeds up web page loading and reduces file sizes. It works with CSS to embed custom typography.

Main use: Embedding and delivering web fonts.
Performance: Uses compression to minimize load times.
Compatibility: Supported by modern web browsers.
Development: Converts traditional fonts into a web-optimized format.

The Web Open Font Format 1.0 was designed for efficient font transmission on the internet.
For more details, visit MDN Web Fonts.

Associated file extensions

.woff

Usage Examples

HTTP Header

When serving content with this MIME type, set the Content-Type header:


    Content-Type: font/woff

HTML

In HTML, you can specify the MIME type in various elements:


    <a href="file.dat" type="font/woff">Download file</a>

Server-side (Node.js)

Setting the Content-Type header in Node.js:


    const http = require('http');    
    
    http.createServer((req, res) => {    
      res.setHeader('Content-Type', 'font/woff');    
      res.end('Content here');    
    }).listen(3000);

Associated file extensions

.woff

FAQs

Should I use application/font-woff or font/woff?

You should use font/woff. While application/font-woff and application/x-font-woff were commonly used in the past, the IETF standardized the top-level font type in RFC 8081. Modern browsers and servers prefer the standard font/woff.

How do I configure Apache to serve WOFF files?

To ensure Apache serves the correct MIME type, add the following line to your .htaccess file or main configuration: AddType font/woff .woff. This prevents browsers from interpreting the font as a generic binary file.

How do I add the WOFF MIME type to Nginx?

In your nginx.conf or mime.types file, ensure the types block includes the mapping. It should look like this: font/woff woff;. After saving the file, reload Nginx to apply the changes.

Why are my WOFF fonts not loading from a CDN?

This is usually a CORS (Cross-Origin Resource Sharing) issue. Browsers restrict fonts loaded from a different domain unless the server sends the correct header. You must configure your CDN or server to send Access-Control-Allow-Origin: * (or your specific domain) for .woff files.

How do I implement a WOFF file in CSS?

Use the standard @font-face rule. Within the src descriptor, specify the URL and the format string: src: url('myfont.woff') format('woff');. This tells the browser to treat the file specifically as a WOFF resource.

What is the difference between font/woff and font/woff2?

The font/woff2 type represents the newer WOFF 2.0 standard, which uses Brotli compression for 30-50% smaller file sizes than WOFF 1.0. Developers generally stack them in CSS, listing font/woff2 first for modern browsers and falling back to font/woff for older ones.

Can I simply rename a .ttf file to .woff?

No, simply renaming the file extension will not work. WOFF files contain specific compression and metadata wrappers around the font data. You must use a font generation tool or a web service to properly convert a TrueType font into the compressed woff format.

How do I configure IIS to serve WOFF files?

In Internet Information Services (IIS), you can add a MIME map via the web.config file. Inside the <staticContent> section, add: <mimeMap fileExtension=".woff" mimeType="font/woff" />. This ensures IIS delivers the file with the correct headers.

General FAQ

What is a MIME type?

A MIME (Multipurpose Internet Mail Extensions) type is a standard that indicates the nature and format of a document, file, or assortment of bytes. MIME types are defined and standardized in IETF's RFC 6838.

MIME types are important because they help browsers and servers understand how to process a file. When a browser receives a file from a server, it uses the MIME type to determine how to display or handle the content, whether it's an image to display, a PDF to open in a viewer, or a video to play.

MIME types consist of a type and a subtype, separated by a slash (e.g., text/html, image/jpeg, application/pdf). Some MIME types also include optional parameters.

How do I find the MIME type for a file?

You can check the file extension or use a file identification tool such as file --mime-type on the command line. Many programming languages also provide libraries to detect MIME types.

Why are multiple MIME types listed for one extension?

Different applications and historical conventions may use alternative MIME identifiers for the same kind of file. Showing them all helps ensure compatibility across systems.