# Favicon sizes in 2026: which five files you actually need
> Five PNG files cover every real case: 16x16 and 32x32 for browser tabs, 180x180 for Apple touch icons, and 192x192 plus 512x512 for Android and PWA manifests. favicon.ico is no longer required by any current browser.
Source: https://rankcert.com/blog/favicon-sizes-guide
Published: 2026-08-29 · Updated: 2026-08-29
---
Favicon guides tend to list fourteen files and six meta tags, most of which target platforms that no longer exist. Here is the current minimum that covers every real client.
## The five files
| Size | Used by |
|---|---|
| 16×16 | Browser tab, bookmarks bar |
| 32×32 | Retina tabs, Windows taskbar |
| 180×180 | Apple touch icon - iOS home screen |
| 192×192 | Android home screen, PWA manifest |
| 512×512 | PWA splash screen, install prompts |
Free tool: [Favicon Generator](https://rankcert.com/tools/favicon-generator) - Turn any image into the five favicon sizes browsers and mobile devices actually request, and get the HTML link tags to paste into your head.
## The HTML
```html
```
The 192 and 512 sizes go in the manifest rather than in link tags:
```json
{
"icons": [
{ "src": "/favicon-192x192.png", "sizes": "192x192", "type": "image/png" },
{ "src": "/favicon-512x512.png", "sizes": "512x512", "type": "image/png" }
]
}
```
## Do you still need favicon.ico?
Almost certainly not. Every browser released in the last decade reads PNG favicons from link tags.
The one argument for keeping one: some clients request `/favicon.ico` blindly without parsing your HTML, and a 404 in your logs is noise. If that bothers you, keep a 32×32 ICO at the root. It is not doing any real work.
## The SVG favicon
Modern browsers accept an SVG favicon, which is one file at any resolution:
```html
```
List both. Browsers that support SVG take it; the rest fall back to the PNG. The catch is that Safari's support has historically been inconsistent, so the PNG fallback is not optional.
An SVG favicon can also respond to dark mode with a media query inside the SVG itself - genuinely useful, since a dark logo disappears against a dark tab bar.
## Designing one that reads at 16px
This is where most favicons fail, and it is a design problem rather than a technical one.
At 16×16 you have 256 pixels. A full wordmark shrunk down is illegible mush. What works:
- **A single letter** at high contrast.
- **One bold shape** from your logo, not the whole thing.
- **High contrast against both light and dark** tab bars - mid-grey disappears against both.
- **No thin strokes.** Anything under 2px at the source size vanishes.
Design it at 16px first and scale up, rather than designing at 512 and hoping it survives the shrink.
## Why your new favicon is not showing
Favicons are cached more aggressively than almost anything else and largely ignore normal cache headers.
1. Check in a private window first - that rules out your own cache.
2. Add a query string: `href="/favicon-32x32.png?v=2"`.
3. Confirm the file actually returns 200 and is served as `image/png`, not `text/html` from a catch-all route.
4. Hard-refresh, then restart the browser. Some browsers only re-read favicons on startup.
If the icon is right in a private window and wrong in your normal one, nothing is broken - it is cache, and your visitors are not seeing the old one.