Maskable Icon

Why manifest should have a maskable icon

PWA

Why manifest should have a maskable icon

In order for your PWA icon to look optimised on Android devices, you should use the maskable icons format: these ensure that the image fills all available space and does not just leave a white background.

How the SeoChecker maskable icon audit is displayed

If a page has no maskable icon support, SeoChecker will notify it:

How can I add maskable icons?

If you want to pass the audit, you should set up a web app manifest that needs to have an icons array: this last one should contain one object with a purpose property that includes the value maskable or any maskable.

{
  …
  "icons": [
    …
    {
      "src": "path/to/maskable_icon.png",
      "sizes": "196x196",
      "type": "image/png",
      "purpose": "any maskable"
    }
  ]
  …
}