Favicon · Reference

Favicon size guide: every size you actually need

Favicon size requirements grew piecemeal over about 25 years, as each new platform added its own preference. The result is a confusing spread of numbers. Here's what each one is actually for, so you know which ones matter for your site.

The sizes, in plain terms

What you actually need to ship

You don't need to hand-craft all six sizes individually. A practical minimum setup covers three cases:

  1. A 32×32 (and optionally 16×16) PNG for browser tabs, plus a favicon.ico as a fallback for older crawlers
  2. A 180×180 PNG for the Apple touch icon
  3. 192×192 and 512×512 PNGs referenced in a site.webmanifest for Android and PWA support

Design at 512×512 or, better, as an SVG, then export the rest down from that single source. Scaling down from a large, simple design holds up far better than trying to scale a detailed logo up from something tiny.

ICO vs PNG

A .ico file can bundle multiple sizes into one file and remains the most broadly compatible format, including with older tools that only look for /favicon.ico in your site's root by default. PNG favicons, declared explicitly with <link> tags, are what modern browsers actually prefer to render. The safest setup includes both: a root favicon.ico as a fallback, and PNG <link> tags for everything else.

See exactly which of these sizes your site is missing.

Check your favicon

Related reading: favicon not showing in Google search · fixing a broken Apple touch icon