Origin and purpose
ICO (Windows Icon) is one of the oldest image formats still in active use — its design dates to Windows 1.0 in 1985. The format was created for a single purpose: storing the small bitmap images that Windows uses for application icons, file-type associations, and shortcut graphics.
For most of its existence, ICO was a Windows-only concern. Its emergence as a web format came incidentally: when web browsers needed a standard mechanism for site favicons (the small icons in browser tabs and bookmarks), Internet Explorer popularised the convention of serving an .ico file at /favicon.ico. That convention has persisted across all major browsers ever since.
Today, ICO's web relevance is almost entirely the favicon use case. For application iconography, modern platforms have moved on to other formats (.icns on macOS, vector formats on most modern platforms). For browser favicons, ICO continues to hold ground despite the availability of alternatives, mostly because the /favicon.ico convention is so deeply ingrained.
Container structure
An ICO file is a container that holds multiple image variants at different sizes and colour depths. This is the format's defining technical feature.
A typical Windows application icon contains:
- 16×16 — used in taskbar, file lists, small UI.
- 32×32 — used in alt-tab, larger UI.
- 48×48 — used in file explorer.
- 64×64, 128×128, 256×256 — used in larger displays and high-DPI contexts.
Each size can be stored at multiple colour depths (4-bit, 8-bit, 24-bit, 32-bit with alpha). A single .ico file can carry a dozen variants, and the operating system or browser selects the most appropriate one for the rendering context.
The file structure:
- ICONDIR header — count of image variants.
- ICONDIRENTRY array — one per variant, describing dimensions, colour depth, and offset into the file.
- Image data — each variant's actual pixel data, either as a BMP (older convention) or as an embedded PNG (modern convention).
The PNG embedding option was added later and allows ICO files to use PNG compression for individual variants. Modern ICO files used for high-resolution icons (256×256) almost always use PNG-encoded variants because raw bitmap data at that size would be enormous.
The favicon use case
The de-facto web standard for ICO is the favicon. A site's /favicon.ico should contain at least:
- 16×16 — browser tab.
- 32×32 — browser tab on high-DPI displays, bookmark bar.
- 48×48 — Windows taskbar pinned site.
For sites that want comprehensive coverage, additional sizes (64, 96, 128, 192, 256) can be included.
Modern browsers also accept favicons in PNG, SVG, and WebP via explicit <link> declarations:
<link rel="icon" href="/favicon.ico" sizes="any" />
<link rel="icon" href="/favicon.svg" type="image/svg+xml" />
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
Best-practice setups ship both:
/favicon.icofor backwards compatibility (browsers look for this at the root automatically).- An SVG favicon for crisp rendering at any size in supporting browsers.
- A PNG
apple-touch-iconfor iOS home screen bookmarks.
ICO vs PNG vs SVG for favicons
| Aspect | ICO | PNG | SVG |
|---|---|---|---|
| Multi-size in one file | Native | One size per file | Scales automatically |
| Browser support | Universal (favicon default) | Universal via <link> | Most modern browsers |
| File size | 4–25 KB (multi-size) | 1–5 KB per size | 500 bytes – 2 KB |
| High-DPI rendering | Depends on contained sizes | Needs explicit @2x files | Always crisp |
| Colour control | Fixed at encoding time | Fixed at encoding time | Dynamic via CSS |
For new projects in 2026, the recommended pattern is SVG primary (for crisp rendering at any DPI), ICO fallback (for browsers without SVG favicon support and for the automatic /favicon.ico lookup), and PNG apple-touch-icon for iOS.
Creating an ICO file
The standard creation pipeline:
- Design the icon at the largest size you want to ship (typically 256×256).
- Export pixel-snapped versions at each target size (16, 32, 48, etc.). Don't just downscale — each size benefits from being designed or hinted for its pixel grid.
- Combine the sizes into a single
.icofile.
Tools:
- ImageMagick — combines source images into ICO:
convert icon-16.png icon-32.png icon-48.png icon-64.png icon-256.png favicon.ico png2ico— lightweight CLI for the same purpose.icotool(icoutils package) — Unix CLI for ICO creation and extraction.- Photoshop, Affinity Photo, GIMP — handle ICO export with multi-size support.
- Online generators —
realfavicongenerator.netand similar produce a complete favicon set (ICO + PNG variants + SVG + manifest.json) from a single source image.
For a typical favicon workflow, an online generator that produces the full set is usually faster than assembling files manually.
What ICO is not good for
ICO is purpose-built for small icons. It's not suitable for:
- Photographic content. ICO has no compression advantage; PNG or JPEG dwarfs it on size and quality.
- Anything larger than ~256×256. The format supports larger sizes but the multi-variant container overhead and limited compression make it impractical.
- General web imagery. Use WebP, AVIF, JPEG, PNG, or SVG depending on content.
- Animated content. ICO doesn't support animation.
- Vector graphics. Use SVG.
The format's niche is well-defined and narrow: small bitmap icons, especially for the favicon use case where multi-size packing matters.
Modern relevance
ICO matters for:
- Browser favicons. The
/favicon.icoconvention is universal and not going away. - Windows application icons. Native Windows apps still bundle ICO files for executable resources.
- File-type association icons on Windows. Each registered file type has an associated icon, traditionally an ICO.
- Legacy desktop applications built on Windows technology stacks.
ICO does not matter for:
- General web content. Use modern formats.
- macOS and Linux app icons. Different conventions apply.
- Mobile app icons. iOS and Android use their own image formats and packaging.
- Any new use case that isn't constrained by Windows or favicon convention.
Converting to and from ICO
Common workflows:
- WebP/PNG/JPG → ICO — for generating favicons from source images. See WebP to ICO.
- ICO → WebP/PNG — for extracting an icon for use elsewhere. See ICO to WebP.
For favicon generation specifically, the workflow is usually:
- Start with a source image (SVG ideally, or a high-resolution raster).
- Generate multiple sized PNG variants.
- Combine the PNGs into an
.icofile.
# Generate PNG variants from a source
for size in 16 32 48 64 128 256; do
convert source.png -resize ${size}x${size} icon-${size}.png
done
# Combine into ICO
convert icon-16.png icon-32.png icon-48.png icon-64.png icon-128.png icon-256.png favicon.ico
Implementation patterns
A complete favicon setup for a modern site:
<!-- Browsers look for /favicon.ico at the root automatically; explicit declaration is also fine -->
<link rel="icon" href="/favicon.ico" sizes="any" />
<!-- SVG for crisp rendering in supporting browsers -->
<link rel="icon" href="/favicon.svg" type="image/svg+xml" />
<!-- iOS home screen bookmark -->
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
<!-- Web app manifest for Android home screen -->
<link rel="manifest" href="/site.webmanifest" />
The /site.webmanifest references additional icon sizes used when the site is installed as a Progressive Web App:
{
"icons": [
{ "src": "/icon-192.png", "sizes": "192x192", "type": "image/png" },
{ "src": "/icon-512.png", "sizes": "512x512", "type": "image/png" }
]
}
This combination covers all common favicon use cases across browsers, operating systems, and PWA contexts.
Converters
- WebP to ICO — generate favicons from WebP source images
- ICO to WebP — extract icons from ICO files
Further reading
- WebP format overview — recommended raster format for browser content
- SVG Format — vector alternative for favicons
- Image SEO Best Practices — favicon and brand-asset SEO
- WebP Browser Support — broader browser compatibility patterns