Which icon sizes are required for progressive web apps (PWA) as of Q1 2018?

progressive-web-apps
Dan Sorensen picture Dan Sorensen · Feb 17, 2018 · Viewed 20.4k times · Source

Which application icons and sizes are required for a progressive web app (PWA)? For example, should I include Apple icons if Safari doesn't support PWAs?

It seems like a common need among developers, but at this time, I am not certain if there is an official spec or guidance for it.

Answer

yaircarreno picture yaircarreno · Sep 14, 2018

If you want to include a complete set of icons for Android:

icon-72x72
icon-96x96
icon-128x128
icon-144x144
icon-152x152
icon-192x192
icon-384x384
icon-512x512

There is some helpful tools like https://app-manifest.firebaseapp.com/, to create icons.

For iOS, you will need:

icon-120x120
icon-180x180

With square background (can't be transparent background). A good repository for references at https://github.com/gokulkrishh/awesome-meta-and-manifest

Related questions

Can I use Add to home screen in Chrome on an iOS device?

I know I can use Chrome on a desktop or Android device to “Add to Home screen”. I know I can use “Add to homes screen” in Safari iOS. But, can I use “Add to home screen” feature in Chrome …

Read More
Options for testing service workers via HTTP

I want to test service workers but I have a virtual host setup and I can't seem to be able to enable https on localhost. How can I whitelist my local virtual host url to test service workers whenever I …

Read More
What features do Progressive Web Apps have vs. native apps and vice-versa, on Android

In 2015 Google introduced a new approach for developing web apps for Android: progressive web apps. One can create an application that will look like a native application, will be able to use device's hardware like camera and accelerometers, receive push …

Read More