Get a quote
Free tool · Runs in your browser

Web app manifest generator

Fill in your app's details and get a valid manifest.webmanifest and the HTML tags to link it. It warns you about the mistakes that stop install or push on iPhone.

    manifest.webmanifest
    HTML for every page's <head>
    How it works

    Add the manifest in three steps

    1. Download manifest.webmanifest and put it at the root of your site, so it loads at /manifest.webmanifest.
    2. Paste the HTML tags into the <head> of every page. In Lovable, Bolt or another React app that's index.html.
    3. Make the icons with the icon generator and upload its files to the same folders, then test your site with the PWA checker.

    A manifest makes your site installable on Android and desktop. To be installed from Chrome it also needs a service worker, and for push on iPhone the app must be added to the Home Screen first.

    FAQ

    Questions

    What is a web app manifest?

    A JSON file, usually manifest.webmanifest, that tells browsers your app's name, icons, colors and how it opens. Browsers need it before they offer to install your site as an app, and app store packagers such as Bubblewrap read it too.

    Where do I put the manifest file?

    Anywhere on your site, usually the root (/manifest.webmanifest), linked from every page with <link rel="manifest" href="/manifest.webmanifest">. Serve it with the application/manifest+json content type if your host lets you; most hosts already do.

    Should I use manifest.json or manifest.webmanifest?

    Either works: browsers read the file the link points to, whatever its name. .webmanifest is the name in the specification, and many hosts serve it with the right content type automatically.

    Which display mode should I choose?

    standalone for most apps: it opens in its own window without browser bars. iPhone only delivers web push to Home Screen apps whose display is standalone or fullscreen, so avoid minimal-ui and browser if you need push.

    What's the difference between name and short_name?

    name appears in install prompts and app lists. short_name goes under the Home Screen icon, where phones show about 12 characters, so keep it short.

    Is anything I type sent to PWA Stack?

    No. The manifest is built in your browser as you type. Nothing is sent or stored.

    More free tools

    Everything a PWA needs, free

    Rather not do it yourself?

    We'll make your web app installable, with push

    Setup covers the manifest, icons, iOS launch screens, a service worker and web push, tested on real iPhones and Android phones. Fixed price, $149.

    How Setup worksGet a quote