What icon sizes does a PWA need?

A PWA's manifest.json should include icons at: 72×72, 96×96, 128×128, 144×144, 152×152, 192×192, 384×384, and 512×512 pixels. The 192×192 and 512×512 are required by most browsers for installability.

What is a maskable PWA icon?

A maskable icon is a PWA icon designed to be displayed in any shape (circle, squircle, etc.) that the device or launcher chooses. The safe zone is the inner 80% (40% padding on all sides) — keep all important content within this area.

What is the minimum required PWA icon set?

At minimum, include a 192×192 and a 512×512 icon in your manifest.json. Chrome will warn if these are missing and may not offer the install prompt.

Are my images uploaded to a server?

No. All processing happens entirely in your browser using the Canvas API. Your images never leave your device.

Can I use the same icon for both 'any' and 'maskable' purposes in manifest.json?

You can set purpose to 'any maskable' on one icon, but it is better practice to provide two separate icons — one optimised for maskable (full-bleed background, content in center 80%) and one without the extra padding for 'any' display. This ensures neither version looks cropped or padded incorrectly.

Does a PWA icon need to be square?

Yes. All PWA manifest icons must be square (equal width and height). Non-square images will either be stretched or have letterboxing applied by the browser, which looks unprofessional on the home screen.

PWA Icon Generator — Generate Progressive Web App Icons

Why Use This Tool?

Progressive Web Apps (PWAs) need icons at many sizes to support installation across different platforms — Android, iOS, Windows, and desktop Chrome all use different sizes. Getting these right ensures your PWA can be installed from the browser and appears with the correct icon on users' home screens and app drawers.

PWA Icon Size Guide (2026)

Size (pixels)	Usage	Notes
512×512	Required	Splash screen, store
384×384	Recommended	High-density splash
192×192	Required	Home screen, Android
152×152	Recommended	iPad home screen
144×144	Recommended	Windows tile
128×128	Recommended	Chrome browser
96×96	Recommended	Standard density
72×72	Recommended	Low density

Privacy First — 100% Client-Side

Your images are processed entirely in your browser using the HTML5 Canvas API. Nothing is uploaded to any server. You can verify this by disconnecting from the internet after loading the page — the tool works offline.

Tip: For maskable icons, keep all important content (logo, text, main visual) within the inner 80% of the canvas — a 72% inset circle. The outer 20% may be clipped by the device's icon shape. You can use separate icons: one regular icon and one maskable icon, both at 192×192 and 512×512.

Tips for PWA Icons

Maskable icons require careful design — place your logo in the center 80% (inner 460px of a 512px canvas) and fill the entire background with a brand color. The background fills the visible corners when the OS clips the icon.
manifest.json setup — reference icons with the purpose field: { "src": "/icon-192.png", "sizes": "192x192", "type": "image/png", "purpose": "any maskable" }.
192×192 and 512×512 are the two most critical sizes. Include these at minimum. Chrome checks for 192px for the install prompt and 512px for the splash screen.
PNG format only — browsers do not support SVG icons in manifest.json (as of 2026). Always export as PNG.
Test your PWA installation on both Android Chrome and iOS Safari (Add to Home Screen) to verify icon appearance across platforms.

PWA / Web App

Why Use This Tool?

PWA Icon Size Guide (2026)

Privacy First — 100% Client-Side

Tips for PWA Icons