What's the difference between standalone and minimal-ui display modes?

Standalone hides all browser chrome, so the app looks native. Minimal-ui keeps a small set of navigation controls (usually back and refresh) at the top. Fullscreen drops even the status bar, useful for games.

Which icon sizes do I actually need?

At minimum, ship 192×192 and 512×512 PNGs — Chrome and Edge use these for the home screen and splash. Add 144×144 for older Windows tiles, and a 512×512 with `purpose: maskable` so Android can crop it without losing detail.

Why do I need both name and short_name?

`name` shows in the install prompt and app drawer, `short_name` appears under the home-screen icon where there's only room for ~12 characters. If you skip short_name, the OS will truncate name awkwardly on most phones.

Where do I put the manifest.json file?

Save it as `manifest.json` (or `manifest.webmanifest`) at the root of your site, then link it from ` ` with ` `. The browser fetches it on first page load.

Does the manifest alone make my site installable?

No. The browser also requires a service worker that handles a `fetch` event, HTTPS, and at least one 192×192 icon. The manifest is the metadata layer; the service worker proves the site can run offline.

Manifest.json Generator

Create PWA manifest files

manifest.json

App Name

Short Name

Description

Start URL

Scope

App ID

Uniquely identifies your app across installs and origins. Leave blank to fall back to start_url. A path like /?app or any stable string works.

Language

BCP 47 tag for the app's primary language, e.g. en-US or ar. Leave blank to let the device infer it.

Text Direction

Icons

Source URL

Size

Type

Purpose

Source URL

Size

Type

Purpose

Installability checks

•No maskable icon. Android crops a square icon, so add one with purpose: maskable.

Preview

manifest.json

{
  "name": "My App",
  "short_name": "App",
  "description": "A progressive web application",
  "start_url": "/",
  "scope": "/",
  "display": "standalone",
  "orientation": "any",
  "theme_color": "#4A90D9",
  "background_color": "#FFFFFF",
  "icons": [
    {
      "src": "/icons/icon-192x192.png",
      "sizes": "192x192",
      "type": "image/png",
      "purpose": "any"
    },
    {
      "src": "/icons/icon-512x512.png",
      "sizes": "512x512",
      "type": "image/png",
      "purpose": "any"
    }
  ]
}

What is Manifest.json Generator?

Manifest.json Generator helps you create a complete Web App Manifest for Progressive Web Apps. Fill in your app details and get a ready-to-use manifest.json with all required and optional fields properly formatted.

Configure name, short name, description, start_url, scope, display mode (standalone, fullscreen, minimal-ui, browser), orientation, theme color, background color, and any number of icon entries with sizes, type, and purpose. The output matches the W3C Web App Manifest spec so browsers like Chrome, Edge, and Safari recognise it during 'Add to Home Screen'.

How to use

Enter your app's basic info: name, short name, description, theme color, and background color.
Configure display mode (standalone, fullscreen, minimal-ui), orientation, start URL, and scope.
Add icon entries with sizes, then copy or download the generated manifest.json file for your project.

When to use

Adding 'Install app' support to an existing web project so it appears in the OS app drawer.
Customising splash screen color and icon for an in-house PWA shipped to field staff.
Generating a manifest stub for a Next.js or Vite starter that doesn't ship one by default.

Result

You're converting your recipe website into a PWA. Set the name to 'My Recipes', theme color to your brand green, display mode to 'standalone', and generate the manifest to place in your project root.

FAQ

What's the difference between standalone and minimal-ui display modes?: Standalone hides all browser chrome, so the app looks native. Minimal-ui keeps a small set of navigation controls (usually back and refresh) at the top. Fullscreen drops even the status bar, useful for games.
Which icon sizes do I actually need?: At minimum, ship 192×192 and 512×512 PNGs — Chrome and Edge use these for the home screen and splash. Add 144×144 for older Windows tiles, and a 512×512 with `purpose: maskable` so Android can crop it without losing detail.
Why do I need both name and short_name?: `name` shows in the install prompt and app drawer, `short_name` appears under the home-screen icon where there's only room for ~12 characters. If you skip short_name, the OS will truncate name awkwardly on most phones.
Where do I put the manifest.json file?: Save it as `manifest.json` (or `manifest.webmanifest`) at the root of your site, then link it from `<head>` with `<link rel='manifest' href='/manifest.json'>`. The browser fetches it on first page load.
Does the manifest alone make my site installable?: No. The browser also requires a service worker that handles a `fetch` event, HTTPS, and at least one 192×192 icon. The manifest is the metadata layer; the service worker proves the site can run offline.

Manifest.json Generator

manifest.json

Icons

Installability checks

Preview

What is Manifest.json Generator?

How to use

When to use

Result

FAQ

Related Tools

Structured Data Generator

Webpage to PDF

Privacy Policy Generator

Terms of Service Generator

Cookie Consent Generator

CSS Minifier

Manifest.json Generator

manifest.json

Icons

Installability checks

Preview