Web App Manifest Generator
Fill in a few fields and get a valid manifest.json for your Progressive Web App, checked against the install requirements as you type.
What is a web app manifest?
A web app manifest is a small JSON file that tells the browser how your site should behave once it is installed: its name, its icons, the page it opens on, the colors of its window and whether it runs in its own window or in a browser tab.
Without a manifest a site cannot be installed as a Progressive Web App. With one, Chrome, Edge and other browsers can offer an install prompt, and the app gets its own icon on the home screen or desktop.
Manifest fields explained
The generator covers the fields browsers actually use for installation. The first five rows are needed before Chrome will offer to install the app.
| Field | What it does |
|---|---|
| name | Full name shown in the install dialog and the app list. |
| short_name | Label under the home screen icon. Keep it to about 12 characters. |
| start_url | Page that opens when the app is launched. |
| display | standalone opens the app in its own window without browser controls. |
| icons | A 192x192 and a 512x512 PNG are required. Maskable versions are recommended for Android. |
| id | Stable identity for the app, so changing start_url later does not create a second app. |
| scope | Which URLs belong to the app. Links outside it open in the browser. |
| theme_color | Color of the title bar and task switcher. |
| background_color | Color of the splash screen Android shows while the app starts. |
| description | Shown in the richer install dialog, together with screenshots. |
How to add the manifest to your site
Save the file as manifest.json in the root or public folder of your site, then link it from the head of every page. The file name is up to you; manifest.webmanifest is also common.
The icon paths in the generated file follow the names used by the PWA icon generator, so the two downloads work together without editing.
HTML head
<link rel="manifest" href="/manifest.json">Once the manifest is deployed, run your address through the PWA validator to confirm that the file loads and that every icon it lists exists.
Frequently Asked Questions
Should the file be called manifest.json or manifest.webmanifest?
Both work. Browsers only follow the link tag, so any name is fine as long as the href matches. manifest.webmanifest is the name used in the specification, and manifest.json is the one most tutorials and tools use.
Which manifest fields are required for a PWA to be installable?
Chrome needs name or short_name, start_url, a display value of standalone, fullscreen, minimal-ui or window-controls-overlay, and 192x192 and 512x512 icons. The site must also be served over HTTPS.
Does the manifest generator upload my data?
No. The manifest is built in your browser as you type and downloaded directly from the page. Nothing is sent to a server.
Do I still need icons after generating the manifest?
Yes. The manifest only lists the icon files. Use the PWA icon generator to create them with matching file names, then copy the icons folder next to the manifest.