logoredraws.com

Converting a PNG Favicon to ICO

How to convert a PNG favicon to ICO: what the ICO format holds, why each size needs its own pixel-grid refinement, and when you still need an ICO file at all.

Published

Contents
  1. The short answer
  2. What an ICO file contains
  3. Do you still need ICO?
  4. Pixel-grid refinement before conversion
  5. Doing the conversion
  6. Rights and evidence gaps

The short answer

Converting a PNG favicon to ICO means packaging one or more square raster images into a single icon container, usually saved as favicon.ico. Many image editors, command-line utilities and online converters can do this. The conversion itself is simple. What decides whether the icon looks sharp in a browser tab is the quality of the small PNG versions you feed into it.

Both PNG and ICO are raster formats. Converting between them does not create vector artwork, and it cannot add detail that the source PNG lacks. Neither file extension tells you whether editable vector paths exist anywhere in the project. Those paths live in the master logo file, such as an SVG, AI, EPS or PDF that was actually built from vector shapes. A file in one of those formats can also contain only an embedded raster image, so open the file and check before you treat it as vector.

What an ICO file contains

An ICO file is a container that can hold several images of different pixel dimensions. The browser or operating system picks the version that best fits the space available. Current versions of the format can store each image as PNG-compressed data or as an uncompressed bitmap. This multi-size structure is the main difference from a PNG favicon, which holds one image at one resolution.

Small sizes such as 16×16, 32×32 and 48×48 pixels are commonly bundled into favicon.ico. Treat that list as a widely used convention rather than a fixed requirement. Check the current guidance for the browsers and platforms you target.

Do you still need ICO?

Modern browsers accept PNG and SVG favicons declared in the page's HTML head. Many sites still place a favicon.ico at the site root. That file serves as a fallback for clients that request that path automatically, and for older software that expects the ICO format. A common approach is to keep favicon.ico for compatibility and also declare PNG or SVG icons for modern browsers.

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

Pixel-grid refinement before conversion

Automatic downscaling of a large logo to 16 or 32 pixels often produces blurred edges, thin strokes that fade out, and counters (the enclosed spaces in letters like o and e) that fill in. The conversion tool will faithfully pack whatever it is given, so do the refinement in the source artwork first:

  • Start from the vector master and export each target size separately, rather than shrinking one large PNG.
  • Simplify the mark for the smallest sizes. Drop fine details, taglines and small text, and consider using only a symbol or initial.
  • Align key edges and strokes to whole pixels at each size so they render crisp instead of anti-aliased across two pixels.
  • Check contrast against both light and dark browser themes, and decide whether a transparent background works or a solid tile reads better.
  • Review every exported PNG at 100% zoom, and fix individual pixels by hand where needed.

Doing the conversion

Once you have refined PNGs, combine them into one ICO file with any tool that supports multi-size icons. With ImageMagick, for example, you can pass separately prepared PNGs, which keeps your hand-refined pixels intact:

magick favicon-16.png favicon-32.png favicon-48.png favicon.ico

ImageMagick can also generate the sizes from a single source, but that uses automatic resampling and skips the pixel-level refinement described above:

magick logo-512.png -define icon:auto-resize=48,32,16 favicon.ico

After conversion, open the ICO in a viewer that lists the embedded sizes, and confirm that each one is present and looks as intended.

Rights and evidence gaps

Being able to download or convert a logo is not the same as having permission to modify it or use it as a site icon. Rights to the artwork, any fonts in it and the trademark are separate questions to clear with the owner. This article also does not compare specific converter products, their pricing, or their output quality, because no tested evidence on those points was available. Evaluate any tool on your own files before relying on it.