Is Web App Manifest Generator free?

Yes. Web App Manifest Generator is free, has no usage cap, no watermark and no account. There is no paid tier that produces a better export.

Is my icon or artwork uploaded anywhere?

No. Icon resizing, maskable padding, favicon packing and ZIP building all happen on a canvas inside your browser tab. The image you drop in is decoded in memory and never transmitted to Toolspea or anyone else.

Does it work on a phone?

Yes, the whole builder is responsive, though configuring a project and uploading a 1024px icon is more comfortable on a laptop.

Where does manifest.webmanifest go?

In your web root, so it resolves at /manifest.webmanifest, and linked from every page with .

What is the difference between start_url and scope?

start_url is the page the app opens on. scope is the set of paths that stay inside the app window; a link outside the scope opens in the browser instead.

Which display mode should I choose?

standalone for most apps — an app window with no browser UI but with the system status bar. fullscreen suits games and kiosks, minimal-ui keeps a small navigation strip, and browser opts out of an app window entirely.

Is a manifest enough to be installable?

No. Chromium browsers also require HTTPS and a registered service worker with a fetch handler. The PWA App Builder generates both alongside the manifest.

App builder tools

Web App Manifest Generator

Build a valid manifest.webmanifest field by field, with live JSON and a copy button.

Identity

Name

Short name

12 characters or fewer.

Description

Language

Behaviour

Start URL

Scope

Links outside the scope open in the browser.

Display mode

Orientation

Categories

Comma separated.

Colours

Theme colour

Background colour

Site will also ship a service worker

A manifest alone is not enough for a Chromium install prompt.

{
  "id": "/",
  "name": "My Web App",
  "short_name": "MyApp",
  "description": "",
  "start_url": "/",
  "scope": "/",
  "display": "standalone",
  "orientation": "any",
  "theme_color": "#7C4DFF",
  "background_color": "#0B0B12",
  "lang": "en",
  "dir": "auto",
  "icons": [
    {
      "src": "icons/icon-72.png",
      "sizes": "72x72",
      "type": "image/png"
    },
    {
      "src": "icons/icon-96.png",
      "sizes": "96x96",
      "type": "image/png"
    },
    {
      "src": "icons/icon-128.png",
      "sizes": "128x128",
      "type": "image/png"
    },
    {
      "src": "icons/icon-144.png",
      "sizes": "144x144",
      "type": "image/png"
    },
    {
      "src": "icons/icon-152.png",
      "sizes": "152x152",
      "type": "image/png"
    },
    {
      "src": "icons/icon-180.png",
      "sizes": "180x180",
      "type": "image/png"
    },
    {
      "src": "icons/icon-192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "icons/icon-256.png",
      "sizes": "256x256",
      "type": "image/png"
    },
    {
      "src": "icons/icon-384.png",
      "sizes": "384x384",
      "type": "image/png"
    },
    {
      "src": "icons/icon-512.png",
      "sizes": "512x512",
      "type": "image/png"
    },
    {
      "src": "icons/maskable-192.png",
      "sizes": "192x192",
      "type": "image/png",
      "purpose": "maskable"
    },
    {
      "src": "icons/maskable-512.png",
      "sizes": "512x512",
      "type": "image/png",
      "purpose": "maskable"
    }
  ],
  "categories": [
    "utilities",
    "productivity"
  ],
  "shortcuts": [
    {
      "name": "Open MyApp",
      "short_name": "Open",
      "url": "/",
      "icons": [
        {
          "src": "icons/icon-192.png",
          "sizes": "192x192"
        }
      ]
    }
  ]
}

Save it at your web root as /manifest.webmanifest and link it with <link rel="manifest" href="/manifest.webmanifest">. Icon paths point at /icons/ — generate those with the App Icon Generator.

What is Web App Manifest Generator?

Toolspea Web App Manifest Generator produces a valid manifest.webmanifest from a form covering id, name, short name, description, start URL, scope, display mode, orientation, theme and background colours, language, categories, shortcuts and icon entries. The JSON updates live as you type and can be copied or downloaded.

How to use it

1Fill in the app name, short name and description.
2Set the start URL and scope, both relative to your site root.
3Choose display mode, orientation and colours.
4Copy the generated JSON or download manifest.webmanifest and place it in your web root.

Features

Every field the install prompt reads, with sensible defaults
Live JSON preview that updates on every keystroke
Standard icon entries including maskable purposes
Optional categories, language, shortcuts and screenshot entries
Copy to clipboard or download the file directly

When people use it

Adding a manifest by hand

Get valid JSON without memorising which fields the install prompt actually requires.

Debugging an install prompt

Compare your existing manifest against a known-good one to spot the missing scope or icon size.

Known limits

A manifest alone does not make a site installable — Chromium browsers also want HTTPS and a service worker with a fetch handler.
Icon paths point at the standard /icons/ folder; generate the images with the App Icon Generator or the PWA App Builder.