Favicon (.ico) vs PNG
ICO and PNG are not competitors — they're partners. The modern favicon setup uses .ico as the universal fallback and PNG as the high-DPI override. Here is exactly when each one wins.
ICO is unique in that a single file embeds multiple resolutions. The browser or OS picks the closest match at draw time — no upscaling, no fuzzy edges.
PNG is sharper at any individual resolution and supports better compression for solid-colour logos. It cannot embed multiple sizes in one file.
The optimal setup is one multi-size .ico plus standalone 32×32 and 180×180 PNGs for high-DPI browsers and iOS.
วิธีการทำงาน
- 1
Start from a 512×512 source
PNG or SVG.
- 2
Generate both formats
FetchFavicon outputs a multi-size .ico plus standalone 16/32/48/180/192/512 PNGs.
- 3
Link both in <head>
<link rel="icon" href="/favicon.ico"> followed by <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">.
ลองเลย
Generate both .ico and PNG
เครื่องมือแปลงไฟล์ PNG เป็น ICOคำถามที่พบบ่อย
Which has smaller file size?+
A single PNG is smaller than an .ico with the same resolution, but a multi-size .ico replaces 4-6 PNGs and usually wins on total bytes.
Does Google show PNG favicons in search results?+
Yes. Google supports both .ico and PNG. It prefers a square aspect ratio of at least 48×48.
Can PNG support dark mode?+
Not directly. Use an SVG variant alongside your PNG for dark-mode support.