PWA Icon & Web Manifest Generator

Everything a Progressive Web App needs to install nicely — icons with safe zones and a manifest you can edit.

Size100%

Move ←→0Move ↑↓0

Background & shape

FromTo

Corner radius22%Padding14%Sharpen tiny sizesLess padding and a heavier weight at 16 and 32 px, so tab icons stay readable.

Web app manifest

App nameShort nameDisplay

Theme

Splash bg

Start URLIcons folder

Include Windows tilesmstile-150x150.png + browserconfig.xml (only needed for old Edge/Windows pins).

Your icon

Add an image to start

16px ×2

32px ×2

64px

Browser tab

My App

Other tab

Search results

My Apphttps://example.com

Home screensSafe zone

App

Android circle

Android squircle

Android square

Android crops icons to different shapes — keep the important part inside the dashed safe zone.

Add it to your site

<!-- Put the files in your site's root (public folder), then add to <head>: -->
<link rel="icon" href="/favicon.ico" sizes="48x48">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png">
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<meta name="theme-color" content="#4f46e5">

What's in the ZIP

favicon.ico16, 32 & 48 px in one file — every browser
favicon-16x16.pngBrowser tabs
favicon-32x32.pngTabs on high-DPI screens
favicon-96x96.pngGoogle search results & desktop shortcuts
apple-touch-icon.png180 px — iPhone & iPad home screen
android-chrome-192x192.pngAndroid home screen
android-chrome-512x512.pngAndroid splash & PWA install
maskable-icon-512x512.pngAndroid adaptive icon (safe-zone padded)
site.webmanifestWeb app manifest
head-snippet.htmlThe tags to paste into <head>

Loading Tool...

Help shape PWA Icon & Web Manifest Generator

The bug you just noticed will fade in 3 minutes. The feature idea will vanish after your next tab switch. Crazy peps don't suffer silently.

0/1000

Discord Contribute

Frequently Asked Questions

At least 192×192 and 512×512 PNGs in the manifest; a maskable 512 px icon for Android adaptive shapes; and a 180 px apple-touch-icon for iOS.

name, short_name, start_url, display, theme_color, background_color and icons. Edit them here and download site.webmanifest.

Launchers crop maskable icons to their own shape. Keep your logo inside the dashed safe zone — the maskable file here is padded automatically.

No. Icons are generated in your browser.

Continue with a nearby utility

Favicon & App Icon Generator

Emoji Favicon Generator

Image Editor & Compressor — Private, In-Browser

QR Code Generator & Scanner

Frequently Asked Questions