Favicon Sizes in 2026: The Only Files You Need
Favicon generators still produce twenty-plus files for devices nobody uses. In 2026, a small, well-chosen set covers every modern browser, Google Search results, iPhone and Android home screens, and installed web apps.
The minimal set
| File | Size | Used by |
|---|---|---|
| favicon.ico | 16, 32 and 48 px inside one file | Legacy browsers, RSS readers and tools that request /favicon.ico |
| icon.svg | Scalable | Modern browsers (preferred when present); can adapt to dark mode |
| favicon-96x96.png | 96 × 96 | Google Search and desktop shortcuts |
| apple-touch-icon.png | 180 × 180, opaque | iPhone and iPad home screens |
| web-app-manifest-192x192.png | 192 × 192 | Android home screen, Chrome install |
| web-app-manifest-512x512.png | 512 × 512 (+ a maskable version) | Splash screens, app stores for PWAs |
The apple-touch-icon must be opaque — iOS fills transparent areas with black. Use a solid background colour.
The HTML
<link rel="icon" href="/favicon.ico" sizes="16x16 32x32 48x48">
<link rel="icon" href="/icon.svg" type="image/svg+xml">
<link rel="icon" href="/favicon-96x96.png" type="image/png" sizes="96x96">
<link rel="apple-touch-icon" href="/apple-touch-icon.png" sizes="180x180">
<link rel="manifest" href="/site.webmanifest">The favicon generator builds all of these — plus the site.webmanifest and a ZIP — from a logo, letters or an emoji, with live previews of a browser tab, a Google result and phone home screens.
Google Search requirements
According to Google Search Central, your favicon must be square (1:1), at least 8 × 8 px — though Google recommends larger than 48 × 48 — and in a supported format (ICO, PNG, SVG, GIF, JPEG, BMP and others). The favicon and the home page must be crawlable, and the icon should represent your brand. A 96 × 96 PNG or an SVG meets all of this. Google may take days or weeks to pick up a new favicon after it recrawls your home page.
Maskable icons and dark mode
Android crops installed-app icons into circles, squircles or rounded squares. A maskable icon keeps the important artwork inside a centred circle 80% of the icon's width, and fills the rest with a background colour. List it separately in the manifest with "purpose": "maskable", alongside the normal icons. Combining "any maskable" in a single entry makes the regular icon look shrunken.
An SVG favicon can include a @media (prefers-color-scheme: dark) style so the icon stays visible on dark browser tabs. Check how your 16 px icon looks on both light and dark tabs — fine details disappear at that size, so a bold letter or a simple shape works best.