PWA Manifest Generator
Generate Progressive Web App manifest.json files with a visual form-based interface and preset templates
Basic Information
0/300 characters
Display Settings
Icons * (minimum 2)
Advanced Settings
Shortcuts (Optional)
No shortcuts added yet
Validation Status
Recommended Settings
Best Practices
- •Include both 192x192 and 512x512 icons for optimal compatibility across devices
- •Use maskable icons for Android adaptive icons that work with shaped icon masks
- •Keep short_name under 12 characters for better display on home screens
- •Set theme_color to match your app's primary brand color for a seamless experience
Installation Requirements
- •Must be served over HTTPS (except localhost for testing)
- •Requires a service worker registered on the same origin
- •User must visit your site at least once before install prompt appears
- •Name (or short_name), start_url, icons, and display are required for installability
Most Popular
Most developers use standalone display mode with 2 icons (192x192 and 512x512) and custom theme colors
When to Use This Tool
Create manifest files for new Progressive Web Apps to enable installation, splash screens, and native-like experiences. Essential first step for any PWA project to define how your app appears when installed on user devices.
Convert existing mobile websites into installable PWAs by generating proper manifest files. Add to home screen functionality and improve user engagement with app-like installation and standalone display mode.
Generate compliant manifest files for submitting PWAs to app stores like Microsoft Store, Google Play Store (via TWA), or Samsung Galaxy Store. Ensure all required metadata and icons are properly configured.
Create consistent app experiences across desktop and mobile platforms using a single manifest file. Configure display modes, shortcuts, and icons optimized for different device types and operating systems.
How It Works
Fill in basic information (name, short name, description, start URL)
Configure display settings (mode, orientation, theme colors)
Add and configure app icons (minimum 192x192 and 512x512 required)
Optionally add advanced settings (scope, language, categories)
Optionally add shortcuts for quick actions
Preview the generated JSON in real-time
Download as manifest.json or manifest.webmanifest
Add to your web app's root directory and link from HTML
100% Private
Files never leave your device. All processing happens locally in your browser.
Lightning Fast
Powered by Web App Manifest Spec for optimal performance on modern browsers.
Secure
No data collection, no tracking, no sign-up required.
Frequently Asked Questions
What fields are required for a PWA manifest?
For basic installability, you need: name (or short_name), start_url, icons (minimum 192x192 and 512x512), and display mode. Additionally, your PWA must be served over HTTPS and have a service worker registered.
What icon sizes should I include?
At minimum, include 192x192px and 512x512px icons. For better compatibility, also include 72x72, 96x96, 128x128, 144x144, 152x152, 384x384. Use 'maskable' purpose for Android adaptive icons that work with shaped masks.
What's the difference between .json and .webmanifest?
Both extensions work identically - they're just different file extensions for the same content. .webmanifest is the official standard extension, but .json is more commonly used. Choose based on your preference or server configuration.
What display modes are available?
Four display modes: fullscreen (no browser UI), standalone (looks like native app), minimal-ui (minimal browser UI), and browser (normal browser tab). Most PWAs use standalone for an app-like experience.
How do I use the generated manifest?
Save the generated file as manifest.json or manifest.webmanifest in your web app's root directory. Then add <link rel="manifest" href="/manifest.json"> to your HTML <head> section. Ensure it's served with correct MIME type (application/manifest+json).
What are maskable icons?
Maskable icons are designed to work with Android's adaptive icon system. They include extra padding around the icon content (safe zone) so the icon looks good when shaped into circles, squares, or other forms by the device.