Favicon Sizes: Every Dimension You Actually Need
The favicon sizes you need are 16x16 and 32x32 PNG for browser tabs and bookmarks, 180x180 for the iOS apple-touch-icon, and 192x192 plus 512x512 PNG for Android home screens and PWA install. A favicon.ico holding 16, 32 and 48 pixel entries covers anything that requests /favicon.ico directly. Every other size is optional, and most sites ship none of them.
The sizes you actually need
| Size | Used for | Keep it? |
|---|---|---|
| 16, 32, 48 | Browser tab and bookmarks, bundled inside favicon.ico | Keep |
| 180x180 | apple-touch-icon for the iOS home screen | Keep |
| 192x192 | Android launcher icon, listed in the manifest | Keep |
| 512x512 | PWA splash and install prompt, listed in the manifest | Keep |
| SVG | Crisp tab icon at any size, can adapt to dark mode | Optional |
Why more than one size
A browser tab asks for an icon roughly 16 to 32 pixels wide. An Android home screen asks for 192. A PWA splash screen asks for 512. These are not the same picture scaled. At 16 pixels a mark has about 256 pixels to work with, and anything that survives there has to be far simpler than what looks right at 512.
When you declare several sizes, the browser picks the closest match and scales from there. Declaring only a large icon means every small surface downsamples it, which is where the grey smudge in the tab comes from. Declaring only a small one means every large surface upscales it, which is where the blurry home screen icon comes from. The favicon size checker previews your image at 16, 32, 48 and 180 pixels, so you see this before you ship.
What those numbers look like
Sizes to stop shipping
| Size | Was for | Keep it? |
|---|---|---|
| 57, 60, 72, 76 | apple-touch-icon for iOS 6 and earlier iPads | Drop |
| 114, 120, 144, 152 | Retina apple-touch-icon for old iPhones and iPads | Drop |
| 70, 150, 310 | Windows tile icons via browserconfig.xml | Drop |
| 160, 196 | Assorted old Android and Chrome shortcut sizes | Drop |
Where the files go
- public/
- favicon.ico16, 32 and 48 in one file
- favicon-16x16.pngAddress bar
- favicon-32x32.pngBrowser tabs
- favicon-96x96.pngDesktop shortcuts
- apple-touch-icon.png180x180, iOS home screen
- icon-192.pngAndroid home screen
- icon-512.pngPWA splash screen
- manifest.jsonLists the PWA icons
Flat in the public root is the convention because several of these are also requested by path, with no link tag involved.
Favicon size FAQ
What is the minimum set of favicon sizes?
A favicon.ico containing 16 and 32, a 180x180 apple-touch-icon.png, and 192x192 and 512x512 PNGs listed in your web app manifest. That covers desktop browsers, iOS home screens, Android and PWA install with five files.
Do I still need 57x57 and 72x72 for iOS?
Only if you support very old iPhones and iPads. Current iOS uses the 180x180 apple-touch-icon and scales it down where it needs something smaller, so a single 180 is enough for almost every site.
Does a bigger favicon slow the page down?
No meaningfully. Icons are small PNGs measured in single-digit kilobytes and browsers request only the size they need, plus they are cached aggressively. Shipping a 512 you never use costs less than a blurry home screen icon.
Should I ship Windows tile icons?
No. The 70, 150, and 310 tile sizes and browserconfig.xml targeted Windows live tiles, which are retired. Drop them.
Can a favicon.ico hold more than one size?
Yes. The .ico format is a container that holds 16, 32, and 48 in a single file. The browser picks the size it needs from inside it.