How to Create ICO Files from Images: Favicon & Icon Guide

What Is the ICO Format and Why Does It Still Matter?

The ICO (Icon) format was created by Microsoft for Windows application icons, and it became the standard favicon format for the web when Internet Explorer first supported favicon.ico in 1999. Despite being decades old, ICO remains relevant in 2026 for two specific reasons:

1. Legacy browser compatibility -- Some environments still look for favicon.ico at the root of a website
2. Windows application icons -- Desktop applications, taskbar pins, and Start menu shortcuts require ICO files

What makes ICO unique among image formats is its ability to contain multiple images of different sizes in a single file. A properly made ICO file bundles 16x16, 32x32, and 48x48 versions together, allowing the operating system to select the appropriate size for each context -- browser tabs use 16x16, the Windows taskbar uses 32x32, and the desktop shows 48x48 or larger.

This guide covers how to create ICO files from any source image (PNG, JPG, SVG), with specific focus on multi-size ICO creation, favicon implementation, and Windows application icon requirements.

For the broader picture of favicon implementation including PNG, SVG, and Apple touch icons, see our comprehensive how to create a favicon guide.

ICO Size Requirements

Different contexts display icons at different sizes. A complete ICO file should contain multiple sizes:

Minimum ICO for Web Favicons

For a website favicon, include at minimum:

• 16x16 -- Standard browser tab icon
• 32x32 -- Retina/HiDPI browser tab, Windows taskbar
• 48x48 -- Windows site pinning

Full ICO for Windows Applications

For Windows desktop applications, include all sizes from 16x16 through 256x256. The 256x256 layer should use PNG compression (supported since Windows Vista) to keep the file size manageable.

Method 1: Online ICO Creation

The fastest approach is our ICO converter:

1. Upload your source image (PNG, JPG, SVG, or any supported format)
2. The converter automatically generates multi-size ICO output
3. Download the ICO file

For creating complete favicon sets (ICO + PNG + SVG + Apple touch icon), the image converter can produce all the required sizes and formats from a single source image.

Method 2: ImageMagick (Multi-Size ICO)

ImageMagick can create multi-size ICO files from any source image:

# Create a multi-size favicon.ico from a PNG
magick source.png \
  \( -clone 0 -resize 16x16 \) \
  \( -clone 0 -resize 32x32 \) \
  \( -clone 0 -resize 48x48 \) \
  -delete 0 \
  -colors 256 \
  favicon.ico

# Create a high-quality multi-size ICO with PNG compression for large sizes
magick source.png \
  \( -clone 0 -resize 16x16 \) \
  \( -clone 0 -resize 32x32 \) \
  \( -clone 0 -resize 48x48 \) \
  \( -clone 0 -resize 64x64 \) \
  \( -clone 0 -resize 128x128 \) \
  \( -clone 0 -resize 256x256 \) \
  -delete 0 \
  favicon.ico

From SVG Source (Best Quality)

SVG produces the sharpest ICO because the vector paths are rasterized at each size independently:

# Create ICO from SVG with high-density rendering
magick -density 300 logo.svg \
  \( -clone 0 -resize 16x16 \) \
  \( -clone 0 -resize 32x32 \) \
  \( -clone 0 -resize 48x48 \) \
  \( -clone 0 -resize 256x256 \) \
  -delete 0 \
  favicon.ico

For more on SVG as a source format, see our SVG vs PNG comparison.

From JPG Source (Handle Background)

Since ICO supports transparency but JPG does not, converting from JPG requires either accepting the solid background or creating transparency:

# Simple conversion (keeps background)
magick logo_on_white.jpg \
  \( -clone 0 -resize 16x16 \) \
  \( -clone 0 -resize 32x32 \) \
  \( -clone 0 -resize 48x48 \) \
  -delete 0 \
  favicon.ico

# Remove white background and create transparent ICO
magick logo_on_white.jpg \
  -fuzz 10% -transparent white \
  \( -clone 0 -resize 16x16 \) \
  \( -clone 0 -resize 32x32 \) \
  \( -clone 0 -resize 48x48 \) \
  -delete 0 \
  favicon.ico

Method 3: Python (Pillow)

from PIL import Image

def create_ico(source_path, output_path, sizes=None):
    """Create a multi-size ICO from a source image."""
    if sizes is None:
        sizes = [(16, 16), (32, 32), (48, 48), (64, 64), (128, 128), (256, 256)]

    with Image.open(source_path) as img:
        # Ensure RGBA for transparency support
        img = img.convert("RGBA")
        img.save(output_path, format="ICO", sizes=sizes)

# Create favicon with standard web sizes
create_ico("logo.png", "favicon.ico", [(16, 16), (32, 32), (48, 48)])

# Create Windows application icon with all sizes
create_ico("logo.png", "app.ico",
           [(16, 16), (24, 24), (32, 32), (48, 48),
            (64, 64), (128, 128), (256, 256)])

Batch ICO Creation

import os
import glob

def batch_create_icons(input_dir, output_dir, sizes=None):
    """Create ICO files from all PNG/JPG images in a directory."""
    os.makedirs(output_dir, exist_ok=True)

    for img_path in glob.glob(os.path.join(input_dir, "*.png")):
        filename = os.path.splitext(os.path.basename(img_path))[0]
        output_path = os.path.join(output_dir, f"{filename}.ico")
        create_ico(img_path, output_path, sizes)
        print(f"Created: {output_path}")

batch_create_icons("./logos", "./icons")

Method 4: Using png2ico (Lightweight CLI Tool)

png2ico is a dedicated tool for creating ICO files from PNG inputs:

# Install (varies by OS)
# macOS: brew install png2ico
# Ubuntu: apt install png2ico

# Create multi-size ICO from separate PNGs
png2ico favicon.ico icon-16.png icon-32.png icon-48.png

# If you only have one source image, resize first
magick source.png -resize 16x16 icon-16.png
magick source.png -resize 32x32 icon-32.png
magick source.png -resize 48x48 icon-48.png
png2ico favicon.ico icon-16.png icon-32.png icon-48.png
rm icon-16.png icon-32.png icon-48.png

Method 5: Using Sharp (Node.js)

For web applications that need to generate ICO files programmatically:

const sharp = require("sharp");
const toIco = require("to-ico"); // npm install to-ico
const fs = require("fs");

async function createIco(sourcePath, outputPath, sizes = [16, 32, 48]) {
  const buffers = await Promise.all(
    sizes.map((size) => sharp(sourcePath).resize(size, size).png().toBuffer()),
  );

  const ico = await toIco(buffers);
  fs.writeFileSync(outputPath, ico);
}

// Create favicon
await createIco("logo.png", "favicon.ico", [16, 32, 48]);

// Create Windows app icon
await createIco("logo.png", "app.ico", [16, 24, 32, 48, 64, 128, 256]);

Implementing the ICO Favicon on Your Website

Once you have created the ICO file, implement it in your HTML:

<!-- Minimum favicon implementation -->
<link rel="icon" href="/favicon.ico" sizes="48x48" />

<!-- Complete modern favicon setup -->
<link rel="icon" href="/favicon.ico" sizes="48x48" />
<link rel="icon" href="/favicon.svg" type="image/svg+xml" />
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
<link rel="manifest" href="/manifest.webmanifest" />

The manifest.webmanifest File

{
  "name": "Your App Name",
  "icons": [
    { "src": "/icon-192.png", "type": "image/png", "sizes": "192x192" },
    { "src": "/icon-512.png", "type": "image/png", "sizes": "512x512" }
  ]
}

For a complete walkthrough of modern favicon implementation, see our how to create a favicon guide.

Creating Windows Application Icons

Windows application icons have stricter requirements than web favicons:

Creating a Windows App Icon

# Create a comprehensive Windows application ICO
magick source_512.png \
  \( -clone 0 -resize 16x16 \) \
  \( -clone 0 -resize 24x24 \) \
  \( -clone 0 -resize 32x32 \) \
  \( -clone 0 -resize 48x48 \) \
  \( -clone 0 -resize 64x64 \) \
  \( -clone 0 -resize 128x128 \) \
  \( -clone 0 -resize 256x256 -define icon:auto-resize \) \
  -delete 0 \
  app.ico

Design Tips for Small Icons

At 16x16 pixels, you have extremely limited space. Here are design strategies:

1. Use your logo mark, not the full logo -- The text portion of your logo will be unreadable at 16px. Use the icon/symbol only.

2. Maximize contrast -- At small sizes, low-contrast elements disappear. Use bold colors against transparent or contrasting backgrounds.

3. Simplify aggressively -- Remove fine details that collapse at small sizes. A simplified version at 16x16 often looks better than a scaled-down version of a detailed design.

4. Test at actual size -- View your icon at 16x16, 32x32, and 48x48 on a real screen (not zoomed in) to evaluate clarity.

5. Consider pixel hinting -- For the 16x16 and 32x32 versions, manually adjusting the design to align with the pixel grid produces noticeably sharper results than automated downscaling.

Converting Existing Favicons

If you need to update or extract an existing ICO file:

# Extract all sizes from an ICO file as separate PNGs
magick favicon.ico favicon-%d.png

# View what sizes are in an ICO file
magick identify favicon.ico

# Convert an old ICO to a modern ICO with additional sizes
magick old_favicon.ico[0] -resize 256x256 \
  \( -clone 0 -resize 16x16 \) \
  \( -clone 0 -resize 32x32 \) \
  \( -clone 0 -resize 48x48 \) \
  -delete 0 \
  new_favicon.ico

Converting ICO to Other Formats

Sometimes you need to go the other direction:

• ICO to PNG -- Use our PNG converter to extract the largest size from an ICO file
• ICO to JPG -- Use our JPG converter for a raster version without transparency
• ICO to SVG -- Use our PNG to SVG tool after extracting the PNG (note: this produces a traced vector, not a true vector conversion)

Troubleshooting

ICO File Not Showing in Browser

• Clear browser cache (Ctrl + Shift + Delete)
• Check that the file is at the correct path
• Verify the <link> tag in your HTML head section
• Test in an incognito/private window

ICO Appears Blurry

• The source image was too small -- start with at least 256x256
• The 16x16 version lacks pixel hinting -- consider hand-editing at this size
• Use the resize image tool to create properly sized source images

ICO File Is Too Large

• ICO files over 100 KB are unusual for web favicons -- you may have too many sizes
• Use PNG compression for sizes 64x64 and above
• For web favicons, three sizes (16, 32, 48) are sufficient

Transparency Not Working

• Ensure your source image has an actual alpha channel (not just white background)
• Use RGBA PNG as input, not JPG
• For removing backgrounds from images, see our how to make transparent backgrounds guide

Summary

Creating ICO files requires understanding the multi-size container format and choosing appropriate sizes for your use case. For web favicons, include 16x16, 32x32, and 48x48. For Windows application icons, include all sizes up to 256x256. Start from the highest quality source image available -- ideally SVG or a large PNG. Use our ICO converter for quick conversions, ImageMagick for multi-size CLI creation, or Pillow/Sharp for programmatic generation in your build pipeline.

For the complete modern favicon implementation including SVG favicons, Apple touch icons, and web manifest configuration, see our how to create a favicon guide. For additional image format conversions, explore our WebP converter, PNG converter, and JPG converter.