manifest.json · pwa · icons · theme · live

Generate a Web App Manifest

Build manifest.json for a Progressive Web App. Sets identity, icons, theme, display mode and orientation. Drop into your site root.

Web Manifest Generator
Name
My App
identity
Display
standalone
mode
Icons
3
192/512/mask
Size
604 B
json
Display:
input · fields
name
short_name
description
start_url
scope
theme_color
background_color
orientation
output · manifest.json
{
  "name": "My App",
  "short_name": "MyApp",
  "description": "A description of the app.",
  "start_url": "/",
  "scope": "/",
  "display": "standalone",
  "orientation": "portrait",
  "theme_color": "#000000",
  "background_color": "#ffffff",
  "icons": [
    {
      "src": "/icons/icon-192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "/icons/icon-512.png",
      "sizes": "512x512",
      "type": "image/png"
    },
    {
      "src": "/icons/icon-512-maskable.png",
      "sizes": "512x512",
      "type": "image/png",
      "purpose": "maskable"
    }
  ]
}
Quick Start

How to ship a PWA manifest

The manifest declares your app's identity and chrome — name, icons, theme, display mode. Browsers use it for install banners and standalone mode.

  1. 01

    Name and identity

    name shows on install prompts; short_name on the launcher.

    Lookups reference the IANA registries (MIME, HTTP status, TLDs) bundled at build time — no live network calls, no rate limits, no leaked queries.

    idIANAregistryofflinelive
    name · queryMy App · IANA
    My App
    loaded · IANA bundlespec · ready
  2. 02

    Pick display mode

    standalone for app-like, browser to behave like a normal site.

    Builders emit canonical syntax per the relevant RFC (9110 for HTTP, 5322 for headers, 3986 for URLs) so the output passes spec-compliant parsers.

    displayRFC 9110canonicalspec-compliantlive
    mode · optionsstandalone · live
    display: standalone
    options applied · livecanonical
  3. 03

    Provide icons

    At minimum 192 and 512 PNG plus a maskable icon for adaptive launchers.

    Validation flags common pitfalls — uppercase header names, smart quotes inside Content-Type, missing ;charset=utf-8 — before they bite production.

    iconsvalidationlintpitfallslive
    icons · looked up3 · ready
    192/512/mask
    result · livevalidated
  4. 04

    Link from <head>

    Add <link rel="manifest" href="/manifest.json"> and ship the icon files at the matching paths.

    Copy writes the snippet directly into your clipboard; downloads emit the right extension and MIME so curl/httpie pick them up correctly.

    shipclipboardMIME-correctblobcurl-ready
    ✓ · copiedready · done
    <link rel="manifest">
    shipped · ready to shipsuccess
Pro tips

Web-spec details that bite later

Idempotency saves retries

POST/PUT/DELETE should be safely retried. Use idempotency keys and return the same response on duplicate requests.

Match RFC 9110 status codes

Don’t invent codes. 422 for validation errors, 409 for conflicts, 429 for rate limits. Standard codes work with off-the-shelf clients.

Set <code>Cache-Control</code> deliberately

Default browser caching is conservative. Use max-age + stale-while-revalidate for hot endpoints.

Validate Open Graph in dev

OG tags break silently. Use a previewer like OG Generator + Facebook’s debugger before launch.

CORS is a server concern

The browser sends the preflight; the server decides. Wildcard origins disable credentials — be explicit.

MIME drives behaviour

Servers must send the right Content-Type. Browsers sniff but the spec says they shouldn’t — be explicit to avoid surprises.

Use Cases

When to add a manifest

PWAs, installable web apps, branded chrome.

Installable PWA

Required for browsers to show install prompts. Bundled from IANA registries at build time — no live network call, no rate limit, no leaked queries. The MIME, TLD, and status-code tables are baked in so the tool works offline once loaded.

spec-compliant

Launcher icons

Match Android / iOS adaptive icon expectations. Output is canonical per the relevant RFC (9110 for HTTP, 5322 for headers, 3986 for URLs), so spec-compliant parsers accept it as-is. Cross-browser and cross-library behaviour stays consistent.

offline

Mobile theming

theme_color paints the status bar and chrome. Pairs with the curl-to-fetch converter for end-to-end test stubs — copy the curl from DevTools, paste, get an idiomatic fetch() body. Drop into Playwright/Vitest fixtures without manual translation.

IANA-backed

Kiosk / standalone

display=fullscreen for kiosk-style use. Catches common pitfalls (uppercase header names, smart quotes inside Content-Type, missing ;charset=utf-8) before they bite production. Validation flags rather than auto-corrects so you stay in control.

RFC-aligned

Offline-capable apps

Pair with a service worker for full offline. Validation runs as you type — copy only when the output is shaped correctly. The output drops directly into nginx, Apache, or CDN configs without re-formatting or re-quoting.

production-grade

Multi-platform

Single JSON works across Android, ChromeOS, desktop. Same input plus same options always produces identical canonical output, so the tool is safe to embed in CI scripts that diff against expected configs.

curl-ready
FAQ

Frequently asked questions

For install prompts, yes — the browser requires both a manifest and a registered SW with a fetch handler.
192 and 512 are required; 1024 helps for splash screens. Maskable variants help on Android.
start_url is what launches when opened; scope limits the URLs treated as part of the app.
Browsers tint the chrome (status bar, title bar) to match — a small but visible brand touch.
No. Manifest generation runs locally in your browser.
Suggest a tool

Something missing?

Tell us what you need. We ship the top requests every two weeks.

Sent straight to the maintainers · no account needed
47 in queue·8 shipped this month
Request queued. Thanks!