Web app manifest generator
A web app manifest tells browsers how your site should look when installed on a phone or desktop. Fill in the fields to get valid JSON and the tags for your page head. The icon files themselves you still need to provide.
Runs in your browser: nothing you enter is sent anywhere.
How to use it
- Enter the name, short name and colors.
- Set the start URL, display mode and the folder where your icons live.
- Copy the JSON into a file and the tags into your page head.
How it works
The tool builds a JSON object with the standard members: name, short_name, description, start_url, scope, display, orientation, theme_color, background_color, lang and icons. Empty fields are left out so the file stays valid. The three icon entries point at icon-192.png, icon-512.png and icon-maskable-512.png in the folder you set.
Tips
- Use the same theme color in the manifest and in the theme-color meta tag.
- Keep the short name brief; it is what shows under the icon.
- Make the icon files yourself or use a favicon generator, then upload them to the folder named here.
Frequently asked questions
What do I do with the JSON?
Save it as manifest.webmanifest (or manifest.json) on your site, serve it with the application/manifest+json type if you can, and add the link tag shown next to the JSON to every page's head.
Which icons do I need?
The list uses 192 by 192 and 512 by 512 PNG files, the two sizes Chrome's installability checks ask for. The optional maskable icon is a 512 by 512 image with a safe area, so Android can crop it into a circle or square without cutting off your logo.
What are the display modes?
standalone opens the site in its own window without browser controls, fullscreen hides even the system bars, minimal-ui keeps a small set of controls, and browser is an ordinary tab.
Is a manifest enough to make a PWA?
Not by itself. Browsers usually also want HTTPS and, depending on the browser, a service worker before they offer to install. This tool only writes the manifest.
What is scope?
It limits which URLs count as part of the app. Pages outside the scope open as a normal browser tab. If you leave it empty it defaults to the folder of the manifest.