Skip to content
Dev Utilities 6 min read

MIME Types: Content-Type Headers and File Extensions Explained

Learn what MIME types are, how the Content-Type header works, the most important MIME types for web development, and how to look up or register custom types.

ToolsVito Team

What Is a MIME Type?

MIME (Multipurpose Internet Mail Extensions) was originally designed for email attachments. Today it is the standard mechanism for communicating the type of data in an HTTP response or request body via the Content-Type header.

Content-Type: application/json; charset=utf-8
             ↑ type  ↑ subtype    ↑ optional parameter

The type/subtype structure: type is a broad category, subtype is the specific format. The optional parameters (most commonly charset) provide additional metadata.

Essential MIME Types for Web Development

/* Text */
text/html; charset=utf-8          — HTML documents
text/css                          — CSS stylesheets
text/javascript                   — JavaScript (also application/javascript)
text/plain                        — Plain text
text/csv                          — CSV data
text/xml                          — XML (for text-based XML documents)

/* Application */
application/json                  — JSON data
application/xml                   — XML (binary or generic)
application/pdf                   — PDF documents
application/zip                   — ZIP archives
application/octet-stream          — generic binary (triggers download)
application/x-www-form-urlencoded — HTML form data
application/javascript            — JavaScript modules

/* Images */
image/jpeg                        — JPEG
image/png                         — PNG
image/gif                         — GIF
image/webp                        — WebP
image/svg+xml                     — SVG
image/avif                        — AVIF
image/x-icon                      — ICO (favicon)

/* Fonts */
font/woff2                        — Web font WOFF2
font/woff                         — Web font WOFF

/* Multipart */
multipart/form-data               — File uploads (HTML form with enctype)

/* Audio/Video */
audio/mpeg                        — MP3
audio/ogg                         — Ogg Vorbis
video/mp4                         — MP4
video/webm                        — WebM

Setting Content-Type in Node.js

// Express — automatic for common responses
res.json(data);          // sets Content-Type: application/json
res.send("<h1>Hi</h1>"); // sets text/html if it looks like HTML
res.sendFile("file.pdf"); // sets Content-Type from file extension

// Manual override
res.setHeader("Content-Type", "text/csv");
res.send(csvData);

// File download (forces Save As dialog)
res.setHeader("Content-Type", "application/octet-stream");
res.setHeader("Content-Disposition", "attachment; filename=report.csv");
res.send(fileBuffer);

Content-Type for API Requests

// Sending JSON to an API (must set Content-Type)
fetch("/api/users", {
  method: "POST",
  headers: { "Content-Type": "application/json" },
  body: JSON.stringify({ name: "Jane" }),
});

// Uploading a file (do NOT set Content-Type — browser sets it with boundary)
const form = new FormData();
form.append("file", fileInput.files[0]);
fetch("/api/upload", { method: "POST", body: form });
// Content-Type: multipart/form-data; boundary=----WebKitFormBoundary...

MIME Sniffing and Security

Browsers will sometimes "sniff" the actual content type if the server doesn't set Content-Type, or if the type is text/plain. This can be a security risk — a text file containing HTML could be rendered as HTML and execute scripts. Always set:

X-Content-Type-Options: nosniff
// Tells browser to trust the declared Content-Type, never sniff

Look Up MIME Types Instantly

Use ToolsVito's MIME Type Lookup to find the correct MIME type for any file extension — or look up what extension corresponds to a given MIME type.

Try it now — free, runs in your browser

MIME Type Lookup

Extensions ↔ content types