Base64 to ICO

How to convert Base64 to ICO

1. Paste the Base64, a data:image/x-icon;base64,... URI, or the whole <link rel="icon" href="data:..."> tag.
2. Check that the status line says Detected ICO and look at the preview.
3. Press Download file. The name defaults to decoded.ico; rename it favicon if it is going on a website.

The MIME type field shows image/x-icon, the type most servers and data URIs use for icons.

ICO files hold several images

Unlike PNG or JPEG, an ICO file is a small container. A typical favicon.ico holds 16×16, 32×32 and 48×48 versions, and Windows application icons often add 256×256. Windows picks the best size for the taskbar, a desktop shortcut or Explorer; browsers pick one for the tab.

The file starts with a 6-byte header, then one 16-byte directory entry per image. Base64 of every ICO therefore begins with AAABAA, which is the bytes 00 00 01 00. Here is Show hex dump for an icon with three sizes:

00000000  00 00 01 00 03 00 10 10  00 00 00 00 20 00 56 00  |............ .V.|
00000010  00 00 36 00 00 00 20 20  00 00 00 00 20 00 6b 00  |..6...  .... .k.|
00000020  00 00 8c 00 00 00 30 30  00 00 00 00 20 00 8c 00  |......00.... ...|
00000030  00 00 f7 00 00 00 89 50  4e 47 0d 0a 1a 0a 00 00  |.......PNG......|

The next two entries describe 32×32 (20 20) and 48×48 (30 30). At offset 54 the first image begins, and the .PNG in the text column shows it is stored as PNG.

PNG or BMP inside

Each image in an ICO is stored either as a complete PNG file or as a bitmap without the usual BM file header. In the second case its data starts with 28 00 00 00, and the height in that bitmap header is doubled, because a 1-bit transparency mask follows the color pixels. Large 256×256 images are usually PNG, since an uncompressed 32-bit bitmap of that size takes more than 256 KB.

An ICO string is often much longer than the icon looks, because every size is in it and bitmap entries are uncompressed. For a website, a single 32×32 PNG or an SVG favicon is usually far smaller. Favicon to Base64 covers inlining those.

List and extract the images in code

This Python function reads the directory and returns each image with its size and format:

import base64, struct

def ico_entries(b64: str):
    data = base64.b64decode(b64.split(",", 1)[-1])
    reserved, kind, count = struct.unpack_from("<HHH", data, 0)
    if reserved != 0 or kind not in (1, 2):
        raise ValueError("not an ICO or CUR file")
    for i in range(count):
        w, h, colors, _, _, bpp, size, offset = struct.unpack_from("<BBBBHHII", data, 6 + 16 * i)
        image = data[offset:offset + size]
        fmt = "png" if image.startswith(b"\x89PNG") else "bmp"
        yield {"size": f"{w or 256}x{h or 256}", "bpp": bpp, "bytes": size, "format": fmt, "data": image}

For the icon above it yields 16x16, 32x32 and 48x48, all png. Write entry["data"] of a PNG entry to a .png file and you have that size as a standalone image. Bitmap entries need a file header and the mask removed before other software reads them, so for those, open the ICO in an icon editor. Base64 in Python has more on decoding.

When the icon will not open

• “This looks like PNG, not ICO.” Many “favicon” strings are plain PNGs. Browsers accept a PNG favicon under any name, but software that needs a real icon file, such as Windows application resources, does not accept a renamed PNG. Use Download as .png and keep it a PNG.
• “Can’t display ICO images”. The browser could not draw any image in the file, usually because an entry is damaged or truncated or uses an unusual bitmap format. The download is still the exact data; open it in an icon editor to see which entry fails.
• The favicon does not change in the browser. Browsers keep favicons in a cache of their own, so check the new icon in a private window.

FAQ