Quick answer
At minimum, provide 192×192 and 512×512 PNG icons with sizes and type. Relative src values resolve against the manifest URL.
- Last verified
- July 31, 2026
- Evidence
- Primary documentation plus transparent editorial analysis
- Primary sources
- 1
Manifest basics
At minimum, provide 192×192 and 512×512 PNG icons with sizes and type. Relative src values resolve against the manifest URL.
Connected next stepApple Touch Icons: Size, Markup, and Cropping for the closest prerequisite or comparison.
What maskable means
A maskable icon allows the operating system to crop it into a circle, rounded square, squircle, or other platform shape without adding a letterbox background.
Connected next stepSVG Favicons: Crisp Icons, Dark Mode, and Safe Markup for the next connected implementation decision.
Package both purposes
Export a general any-purpose icon and a separately composed maskable icon. Do not simply relabel edge-to-edge artwork as maskable; important content may be cut off.
Connected next stepValidate the manifest and maskable declarations and verify the decision with a working output.
Write separate manifest entries for separate artwork
Provide ordinary 192×192 and 512×512 icons with purpose any, plus full-bleed maskable files whose essential artwork remains in the safe zone. Honest filenames make audits and future replacements easier.
Do not add the maskable keyword to a transparent ordinary icon and assume the pixels become adaptive. The file itself needs an edge-to-edge composition.
Validate installation and crop behavior
Parse the manifest, request each resolved src, and compare declared sizes with decoded dimensions. Then preview or install on at least one target platform and inspect circular and rounded-square crops.
A valid manifest is not proof of installability by itself; start_url, scope, display, service worker, and browser-specific criteria can affect the complete PWA experience.
Apply this guide with the relevant tools
Use the smallest tool that verifies the specific decision described above. Each destination keeps the source format, deployment evidence, or platform purpose explicit.
Review the headings, sources, implementation artifact, and update record for this guide as structured JSON.
Download guide evidence ↓- Guide
- PWA and Maskable Icons: Designing for Adaptive Shapes
- Coverage
- Client behavior can change by browser, operating system, platform version, cache state and deployment configuration. Unperformed manual observations are not claimed.
Questions, answered
Can one manifest entry say any maskable?+
Yes, purpose can include multiple keywords, but separate art often gives better results.
Is SVG valid in a manifest?+
It can be, but PNG sizes remain the dependable baseline for install surfaces.
