Written by David Kim — Frontend Developer & WordPress consultant. More about me →
For years I defaulted to .ico files because "that's what favicons are." Then a client's favicon broke on Safari 16, and I realized I'd been cargo-culting a format from 1995 without ever questioning it. I tested both formats across every browser I could find. Here's what I learned.
| ICO | PNG | |
|---|---|---|
| Invented | 1995 (Windows 95) | 1996 |
| What it is | Container format (holds multiple BMPs) | Single-image raster format |
| Max colors | 24-bit (16.7M) | 24-bit + 8-bit alpha |
| File size (32×32) | ~2-5 KB | ~0.5-2 KB |
| Browser support | 100% | 99.7% |
| Multi-size | ✅ Built-in (one file holds all sizes) | ❌ Need multiple files |
PNG files are smaller, support proper alpha transparency (ICO alpha is buggy in some renderers), and every browser since IE11 supports PNG favicons. The one advantage ICO had — bundling multiple sizes in a single file — doesn't matter anymore because you declare multiple <link> tags anyway.
Per CanIUse, PNG favicon support sits at 99.7% globally. The 0.3% is IE10 and below, which collectively have less market share than "people browsing the web on a Nintendo 3DS."
There's exactly one scenario where I still reach for .ico: when a client's CMS has a single file upload field labeled "favicon" and won't accept PNG. Looking at you, certain WordPress themes from 2014. For everything else, PNG is smaller, sharper, and simpler.
Written by David Kim — Frontend Developer & WordPress consultant. More about me →