To correctly implement this file, developers must link it in their web app manifest. A typical entry looks like this:
Among the various sizes required for a polished PWA, the holds a place of critical importance. This guide will explore what this file is, why it matters, and how to create the perfect 192x192 icon for your project. What is icon-192x192.png ?
Replace source-logo.svg with your vector file or high-res PNG. Use -background white if you need a solid color. icon-192x192.png
Sometimes browsers cache the old icon. Clear your browser cache or try adding the app to the home screen again.
(You can add a category here)
When a user "Adds to Home Screen" (A2HS) on an Android device running Chrome, the OS scans the manifest for a 192px icon. If it finds a high-quality version, it uses it. If not, it scrapes the page for a fallback (usually the largest favicon), resulting in a blurry, pixelated mess on the user's pristine home screen.
Icon is not showing for “Add to Home Screen” on iOS Solution: iOS (as of 2025) prefers apple-touch-icon sizes (180×180). Add that separately. Also note that iOS requires your site to be served over HTTPS (except localhost) and have a valid service worker for PWA installation. To correctly implement this file, developers must link
<link rel="manifest" href="/manifest.json">
and site favicons. It is one of the most critical icon sizes because it is the minimum requirement for the "Add to Home Screen" prompt on Android devices. Why this icon is important PWA Requirement What is icon-192x192