PWA assets
PWA icons: a circular maskable safe zone is not installability
An icon is an asset, not a complete PWA. Build a clear silhouette, test real masks and wire the published assets into your application.
Content updated: · Maintainer and corrections
Use the circle, not an 80% square
The guaranteed maskable safe zone is a circle centered in the icon with a radius of 40% of its size. An 80%-wide square has corners outside that circle. The generator scales the complete source rectangle so its diagonal is 80% of the icon size, then centers it on an opaque background.
That conservative fit preserves all artwork but may leave more space around a wide logo. Any content outside the circle, including background, may be clipped. Preview outlines are only guides and are not exported. Review legibility at small sizes and with actual device masks.
Publish the paths and customize the app
Download all four 192/512 PNGs for purpose any and maskable. Place them at the manifest's /icons/ paths or update each src. Replace placeholder name and short_name, review start_url and display, publish the manifest and link it from HTML.
A valid-looking JSON document does not prove paths exist, HTTPS is configured or a platform will offer installation. Check the deployed files, response types and the target platform's current requirements. This tool does not create a service worker or publish anything.
Data provenance