deftools.io Web & Browser

PWA Manifest Generator

Build a Web App Manifest (manifest.json) for installable PWAs. Live JSON preview, validation, icons, shortcuts, screenshots, theme/background colors, display modes. Copy, download, share link.

Quick presets
Identity
Display & URLs
Colors & Theme
Icons

Recommended sizes: 192×192, 512×512 (PNG). Provide a 512×512 maskable icon for nicer Android install.

Shortcuts (app menu items)
Screenshots (install / store UI)
Native apps (optional)
Related apps
manifest.json
HTML to include in <head>
 
 
Copied!

About this tool

A Web App Manifest (manifest.json) is a small JSON file that tells browsers how to install and present your site as a Progressive Web App — its name, icons, theme color, display mode (standalone, fullscreen), start URL, and shortcuts. Without a valid manifest, browsers like Chrome will not offer the "Install app" prompt.

This generator builds the manifest visually: fill in the app fields, add icons (192 and 512 PNG are required; a maskable icon is recommended for Android), optionally add shortcuts and screenshots, and the live JSON preview updates as you type. A built-in validator flags missing required fields and common mistakes, and one click downloads manifest.json plus a ready-to-paste <link rel="manifest"> HTML snippet.

Example: name My App, start_url /, display standalone, theme_color #6366f1, with 192 and 512 icons produces an installable manifest that triggers Chrome's install prompt on desktop and Android.

FAQ

What makes a PWA installable?

Chrome and Edge require a valid manifest with at least name (or short_name), a 192px and 512px icon, start_url, and display mode other than "browser", plus a registered service worker that handles fetch. This tool checks the manifest half of that checklist.

What is a maskable icon and do I need one?

A maskable icon has extra padding so Android can crop it into different adaptive shapes (circle, squircle, rounded square) without clipping the logo. It is optional but strongly recommended for a polished install experience on Android.

Where do I host the manifest and icons?

Serve manifest.json from your site root (or anywhere you link to it) and reference it with <link rel="manifest" href="/manifest.json">. Icons paths in the manifest are relative to the manifest URL, so "/icons/192.png" resolves from the site root.

Can I share a manifest-in-progress with a teammate?

Yes — "Copy share link" encodes the entire form state (fields, icons, shortcuts, screenshots) into the URL hash. Opening that link restores the exact same configuration on any browser.

How do I check if my existing manifest is valid?

Use the <a href="/web-app-manifest-validator" class="text-accent hover:underline">Web App Manifest Validator</a> — paste your manifest.json and get instant feedback on required fields, icons, start_url, scope, and display mode compliance.

Related web & browser tools

Copied!