The ICO format exists for one purpose: site favicons and Windows application icons. Browsers look for a favicon.ico at the site root by convention, Windows uses ICO for executable and shortcut icons, and despite newer alternatives like PNG and SVG favicons, ICO remains the most broadly supported format for these specific uses.

This guide explains what ICO is, why it's still relevant, the sizes a favicon should include, and how to convert PNG or JPG into a usable ICO file.

What ICO Is

ICO is a Windows container format that stores multiple image sizes in a single file. A single .ico can contain 16×16, 32×32, 48×48, and larger versions, and the operating system or browser picks the size appropriate to context.

When to Use ICO

  • Site favicon — The /favicon.ico convention works across every browser
  • Windows executables — Application icons embedded in .exe files
  • Windows shortcuts — Custom icon files for desktop shortcuts
  • Legacy compatibility — Internet Explorer and very old browsers expect ICO

Modern Favicon Strategy

A robust favicon setup includes multiple files for different contexts:

  • favicon.ico — Root-level fallback (16×16, 32×32, 48×48 multi-size)
  • favicon-32x32.png — Standard browser tab
  • apple-touch-icon.png — iOS home screen (180×180)
  • android-chrome-192x192.png — Android home screen
  • SVG favicon — Scales to any size; modern browsers

Recommended Favicon Sizes Inside the ICO

  • 16×16 — Browser tab, address bar
  • 32×32 — Browser tab on high-DPI screens, Windows taskbar
  • 48×48 — Windows site shortcuts
  • Multi-size ICO files include all three

Designing for Tiny Sizes

  • Simplify the design — A full logo doesn't read at 16×16
  • Strong contrast — Light and dark mode both need to work
  • One recognisable element — Single letter, simple shape, distinctive silhouette
  • Test in browser — View at actual rendered size, not zoomed
  • Avoid thin lines — Disappear at small sizes

Conversion Mechanics

  • Start from a square source image, ideally 512×512 or larger
  • The converter generates the smaller sizes by downscaling
  • Some tools include all standard sizes by default; others let you choose
  • Transparency in the source PNG is preserved in the ICO

HTML Reference

Standard root-level reference:

<link rel="icon" href="/favicon.ico" sizes="any">

For modern multi-format setup:

<link rel="icon" type="image/svg+xml" href="/favicon.svg"> <link rel="icon" href="/favicon.ico" sizes="any"> <link rel="apple-touch-icon" href="/apple-touch-icon.png">

Common Pitfalls

  • Detailed logo at 16×16. Becomes an unreadable blob
  • Single-size ICO. Misses higher-DPI displays where larger sizes look sharper
  • Wrong aspect ratio. Non-square source gets stretched or padded
  • Forgetting browser cache. Updated favicon may not appear until users hard-refresh
  • Missing /favicon.ico. Browsers and crawlers request it; 404s show in logs
  • JPEG converted to ICO. Compression artifacts visible at icon sizes

Beyond Favicons

  • App icons for Windows installers — Need ICO with sizes up to 256×256
  • Custom folder icons — Set via Windows folder properties
  • Shortcut customisation — Right-click → properties → change icon

Quick Tips

  • Always have a /favicon.ico at the site root
  • Include 16, 32, and 48 px sizes in the ICO
  • Design simply — full logos don't read at 16×16
  • Add SVG and PNG favicons for modern devices
  • Hard-refresh or change filename to bust caches when updating

Use the ICO Converter on Popupnote

The ICO Converter on Popupnote provides a clean tool for converting PNG, JPG, and SVG images into multi-size ICO files — for site favicons, Windows applications, and custom icon needs. The tool runs in your browser without any account required.