Web App Manifest

The Web App Manifest is a JSON document referenced from <link rel="manifest" href="/manifest.json"> that tells the browser how to present the site as an installed app. It's one of the three core PWA requirements (alongside service worker + HTTPS).

Required / strongly-recommended fields:

• name and short_name -- displayed on the install prompt and home-screen.
• icons -- array of icon entries with src, sizes, type, and (importantly) purpose. At minimum: a 192x192 and a 512x512 entry. For Android 12+ Adaptive Icons, include at least one entry with purpose: "maskable" (or "any maskable").
• start_url -- where the app opens when launched from the home screen. Often / with a UTM tag for analytics distinction.
• display -- standalone (most PWAs), fullscreen (immersive / games), minimal-ui (basic browser controls), or browser (default; effectively no PWA).
• theme_color -- the brand color used for the install prompt tint and the Android status bar / OS task-switcher card.
• background_color -- splash-screen color shown briefly during launch before the page loads.

The "PWA install criteria" Lighthouse / Chrome enforce: valid manifest, 192x192 icon, 512x512 icon, name, start_url, display set to standalone / fullscreen / minimal-ui, AND a registered service worker that handles fetch events.

Common bugs:

• display: "browser" -- usually a copy-paste mistake from a starter template; produces zero PWA UX.
• No maskable icon -- Android 12+ crops your icon to a circle/squircle and can hide important parts of the logo.
• Missing theme_color -- the install prompt and Android status bar fall back to a generic tint.
• start_url not in scope -- the worker only controls URLs under its own scope; a start_url outside scope means the launched app doesn't get the worker's offline behavior.