Zero Signup ToolsFree browser tools

Developer Tools

Cache-Control Header Builder

Build and parse Cache-Control HTTP headers in your browser. Pick directives, get max-age presets, server snippets, and a plain-English explanation.

Quick presets

Tap a preset to load common Cache-Control patterns.

Visibility

Flag directives

Numeric directives (seconds)

1 hour

Browser freshness lifetime.

Shared cache (CDN) freshness lifetime; overrides max-age for shared caches.

Window where caches may serve stale while revalidating in background.

Window where caches may serve stale if origin errors or times out.

Generated header

Cache-Control: public, max-age=3600

Any cache may store this response. Browser may serve cached for 1 hour.

Server snippets

Drop into your server config or framework. Customize the path or matcher to fit your routing.

Raw header

Cache-Control: public, max-age=3600

Apache (.htaccess / VirtualHost)

<IfModule mod_headers.c>
  Header set Cache-Control "public, max-age=3600"
</IfModule>

Nginx

add_header Cache-Control "public, max-age=3600" always;

Vercel (vercel.json)

{
  "headers": [
    {
      "source": "/(.*)",
      "headers": [
        {
          "key": "Cache-Control",
          "value": "public, max-age=3600"
        }
      ]
    }
  ]
}

Netlify (_headers)

/*
  Cache-Control: public, max-age=3600

Cloudflare Worker

const response = await fetch(request);
const headers = new Headers(response.headers);
headers.set("Cache-Control", "public, max-age=3600");
return new Response(response.body, { status: response.status, headers });

Next.js (next.config.js headers)

async headers() {
  return [
    {
      source: "/:path*",
      headers: [
        { key: "Cache-Control", value: "public, max-age=3600" },
      ],
    },
  ];
}

Express.js

app.use((req, res, next) => {
  res.setHeader("Cache-Control", "public, max-age=3600");
  next();
});

Common durations

Click a preset to load it as max-age. Useful when you forget the exact second count.

Quick reference

public vs private

public lets shared caches store the response. private restricts caching to the user's browser.

no-cache vs no-store

no-cache caches but revalidates each time. no-store forbids caching entirely.

max-age vs s-maxage

max-age applies to all caches. s-maxage applies only to shared caches and overrides max-age for them.

immutable

Promises the body never changes for this URL. Browsers skip revalidation while fresh. Pair with a long max-age.

stale-while-revalidate

After expiry, caches may serve stale while revalidating in the background. Improves perceived latency.

must-revalidate

Once stale, caches must revalidate before reuse. Stale responses cannot be served on origin failure.

How to use

  1. Choose the Build header tab to compose a Cache-Control value, or the Parse and explain tab to paste an existing value.
  2. Builder: pick a quick preset (Static asset, HTML page, API response private, CDN public, Never cache, or Stale-while-revalidate) or set visibility, flag directives, and numeric directives manually. Each numeric field shows its value in human time.
  3. Read the live header preview, the plain-English explanation, and any conflict warnings. Common-duration presets quickly fill max-age with 1 minute, 1 hour, 1 day, 1 week, 30 days, or 1 year.
  4. Copy the raw header, or pick a server snippet for Apache, Nginx, Vercel, Netlify, Cloudflare Workers, Next.js, or Express to drop straight into your config.
  5. Parser: paste a Cache-Control value (with or without the Cache-Control: prefix). The tool splits directives, explains each one, flags conflicts and duplicates, and summarizes effective browser, shared cache, and revalidation behavior.

About this tool

Cache-Control Header Builder is a two-mode browser tool for the HTTP Cache-Control header defined in RFC 7234 and RFC 9111. The Build tab lets you compose a header by toggling directives instead of memorizing the syntax: pick visibility (public, private, or unset), flip flag directives (no-cache, no-store, no-transform, must-revalidate, proxy-revalidate, immutable, must-understand), and enter numeric directives (max-age, s-maxage, stale-while-revalidate, stale-if-error). Each numeric input shows its value in human time as you type, and a row of common-duration presets covers 1 minute, 5 minutes, 1 hour, 1 day, 1 week, 30 days, and 1 year so you do not have to remember that one year is 31,536,000 seconds. Six quick presets cover the patterns real apps reach for: hashed static assets (1 year, immutable), HTML pages (no-cache for stale revalidation), private API responses, public CDN-cacheable for 5 minutes with a 24-hour stale-while-revalidate window, never-cache for sensitive responses, and stale-while-revalidate for blog and catalog pages. The header preview updates live, a plain-English explanation summarizes browser, shared-cache, and revalidation behavior, and a conflict checker flags mistakes that other generators miss: no-store with max-age, immutable without a long max-age, proxy-revalidate on a private response, and s-maxage on a private response. Server-snippet output is ready to paste into Apache (mod_headers), Nginx (add_header), Vercel (vercel.json), Netlify (_headers), Cloudflare Workers, the Next.js headers config, and Express middleware, with the directive escaped correctly so quotes do not break your config. The Parse tab takes any Cache-Control value, splits it into directives (handling quoted values, the optional Cache-Control: prefix, and an arbitrary number of spaces), explains each directive with the spec semantics, flags non-numeric values where the spec requires delta-seconds, surfaces duplicate directives that lead to undefined behavior across caches, and summarizes the effective browser cache lifetime, shared cache lifetime, and revalidation policy in three quick cards. A reference grid contrasts the directive pairs that confuse most developers (public vs private, no-cache vs no-store, max-age vs s-maxage, immutable, stale-while-revalidate, must-revalidate) so the page doubles as a study sheet. Useful for setting up CDN caching policies, writing the headers for a Next.js or Astro deployment, debugging why a CDN keeps serving a stale response, reviewing a security-sensitive endpoint, or preparing the cache headers for a static asset pipeline. Everything runs locally in your browser. Headers, directive values, and snippets are never uploaded.

Free to use. Works in your browser. No signup, no login.

Related tools

You may also like

All tools
All toolsDeveloper Tools