A favicon is a small icon that represents your website in browser tabs. For Progressive Web Apps (PWA), you also need a web manifest and larger icons for mobile home screens.
Install favicon and PWA icon files
The Web ZIP contains favicon.ico, 16/32 px PNGs, a 180 px Apple touch icon, 192/512 px PWA icons, site.webmanifest and a 1200x630 og.png.
Web ZIP contents
The two PWA PNGs are regular square icons. Their filenames and sizes match the icons array in site.webmanifest; og.png is a separate sharing image.
Connect the icons to your website
- Copy the files from Web into your site's public directory and publish them at the origin root, or adjust the paths for your chosen directory.
- Edit name and short_name in site.webmanifest. start_url and scope are relative to its location; the exported icon paths start with /. Update those paths if the icons are in a subdirectory.
- Add the manifest, favicon and Apple touch links to the HTML head. Serve over HTTPS or localhost. In browser developer tools, check the manifest and that each icon URL returns an image, not an HTML fallback.
<link rel="manifest" href="/site.webmanifest">
<link rel="icon" href="/favicon.ico">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">These icons are not prepared as maskable artwork. The ZIP does not add a service worker or offline support; icons alone do not guarantee installation. Test your target browser and device.
Read the Web, PWA and Chrome integration guide