Skip to content
2xKit

Favicon and App Icon Sizes Explained: Why There Are So Many

Why a single website favicon actually needs a dozen different sizes, and what each one is actually used for.

Quick answer

A website favicon needs multiple sizes, commonly 16x16 and 32x32 for browser tabs, 180x180 for Apple's home-screen icon, and 192x192 plus 512x512 for Android and Progressive Web App icons, because each platform renders the icon at a different physical size and pulls from a different declared file rather than scaling one master image itself. A tool like Favicon Generator generates the full required set from one source image automatically.

It looks redundant that a single small icon needs to exist in a dozen different pixel dimensions, but each size serves a genuinely different display context, and skipping one means that specific context falls back to a blurry upscale or a missing icon entirely, rather than the crisp version you intended.

Why one image can't cover every use case

Browsers, mobile home screens, and app manifests each look for a specifically sized and specifically named icon file rather than automatically resizing a single master image on their own, largely for historical and performance reasons: fetching and scaling one correctly-sized file is faster and sharper than downscaling a much larger image on every page load. A 16x16 icon that's just a shrunk version of a 512x512 image often loses so much detail at that tiny size that fine details (like a small letter or thin lines in a logo) become an illegible blur, which is why favicon designs are often deliberately simplified compared to a full logo.

The common sizes and what each is for

16x16 and 32x32 are the classic browser tab and bookmark bar favicon sizes, small enough that the icon design needs to be simple and legible at a glance. 180x180 is Apple's touch icon size, used when someone adds a website to their iPhone or iPad home screen. 192x192 and 512x512 are used in the web app manifest for Android home-screen icons and Progressive Web App splash screens respectively, with the 512x512 version sometimes displayed briefly at full size during a PWA's launch. Some setups also want a 48x48 or higher-resolution 64x64 variant for Windows taskbar pinning.

Generating the full set from one source image

Rather than manually resizing a logo to a dozen exact dimensions and naming each file correctly, Favicon Generator takes one high-resolution source image and outputs the complete standard set of sizes in one step, ready to drop into a site's root directory or app manifest. It's worth starting from a large, simple, high-contrast version of a logo, since that scales down cleanly to the smallest 16x16 size without becoming an unrecognizable smudge.

Frequently asked questions