Blog

Favicon Sizes in 2026: The Complete Reference

Guide · SEO Tools

A favicon looks like a tiny detail, but a missing or wrong-sized one shows up as a broken image icon on browser tabs, phone home screens, and bookmark bars — a small but visible sign of an unfinished site.

The sizes you actually need

SizeUsed for
16×16Browser tab (classic favicon.ico size)
32×32Browser tab on high-DPI displays, taskbar
48×48Windows site icons
180×180iOS home screen icon (apple-touch-icon)
192×192Android home screen / PWA icon
512×512PWA splash screens, app store-style icons

The HTML tags that actually matter

Modern browsers mostly auto-detect a root-level favicon.ico, but explicit link tags avoid ambiguity and cover mobile platforms that don't fall back gracefully:

<link rel="icon" href="/favicon.ico" sizes="any">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16.png">
<link rel="apple-touch-icon" href="/favicon-180.png">

Design tips for a small canvas

At 16×16px, fine detail and thin lines disappear completely — a favicon needs to read clearly as a simple shape or a single bold letter, not a scaled-down version of your full logo. Test how it actually looks at 16px before finalizing; what looks good at 512px often turns into an unrecognizable smudge at tab size.

Format notes

ICO remains the safest universal format for the root favicon.ico, but PNG works fine for the size-specific link tags above. SVG favicons are gaining browser support but don't yet have full coverage everywhere — pairing an SVG with PNG fallbacks is the safest current approach.