Dev.to WebDev 🛠 Dev 👁 0 📖 2 min read

Does PNG-to-ICO transparency survive? A measured alpha test across 16-128 px

Does PNG-to-ICO transparency survive? A measured alpha test across 16–128 px Yes. A transparent WebP source converted to ICO keeps alpha = 0 at all four corners at every size from 16 to 128 px. Below is the pixel-by-pi

Does PNG-to-ICO transparency survive? A measured alpha test across 16–128 px

Yes. A transparent WebP source converted to ICO keeps alpha = 0 at all four corners at every size from 16 to 128 px. Below is the pixel-by-pixel proof.

The question

When you save an image as JPEG, the alpha channel is gone — JPEG has no transparency. If your icon source was a JPG, renaming the file extension to .ico does not bring alpha back; the pixel data simply doesn't contain it.

But if your source is a PNG or WebP with an alpha channel, does the ICO conversion preserve it? I ran a measurement to find out.

Source image

A 256×256 RGBA image: a red rounded rectangle with a yellow circle at the center. The exterior is fully transparent (alpha = 0). Saved as WebP at quality 90, file size 2,556 bytes.

Method

For each target size (16, 32, 48, 64, 128 px):

  1. Draw the WebP onto a canvas at that exact pixel size.
  2. Read back all pixels with getImageData().
  3. Count transparent pixels (alpha = 0), opaque pixels (alpha = 255), and partially transparent pixels (0 < alpha < 255).
  4. Record the RGBA values at all four corners.
  5. Encode the canvas as PNG and wrap it in an ICO container.

Results

Size (px) ICO bytes Transparent Opaque Partially transparent Corner α (TL/TR/BL/BR)
16 656 60 68 128 0 / 0 / 0 / 0
32 1,292 305 416 303 0 / 0 / 0 / 0
48 1,879 826 1,040 438 0 / 0 / 0 / 0
64 2,529 1,578 1,928 590 0 / 0 / 0 / 0
128 4,773 6,975 8,220 1,189 0 / 0 / 0 / 0

Every number in this table comes from the CSV at icoforge.com/webp-to-ico, where the source WebP and output ICO files are also available for download.

Why four corners at alpha 0 means transparency survived

The source image has a transparent exterior. If the conversion had flattened the image — filling transparent areas with white or black — the corner pixels would have alpha = 255. Instead, all four corners read alpha = 0 at every size. The ICO contains the same transparent regions as the source WebP.

The partially transparent pixel count is also consistent with anti-aliasing at the shape edges: as the icon gets smaller, the ratio of edge pixels to total pixels increases, which is expected behavior for downsampled vector-like shapes.

What about JPEG sources?

JPEG does not store an alpha channel. A JPG file contains only RGB data. If you convert a JPG to ICO, the result has no transparency — not because the converter dropped it, but because the source never had it. Changing a .jpg filename to .ico doesn't change the pixel data inside.

The only way to get a transparent ICO from a photographic JPG source is to add an alpha mask before conversion — for example, by padding the image onto a transparent canvas.

Data and sources

All measurements are reproducible. The raw CSV is available at:

  • webp-to-ico-alpha-measurement.csv — the five rows above, with ICO byte counts, PNG payload byte counts, transparent/opaque/partially transparent pixel counts, and corner RGBA values.

The source WebP and output ICO files for each size are downloadable from the WebP to ICO tool page.

License: CC0 (public domain).

📰 Read the original article on Dev.to WebDev

Originally published by Dev.to WebDev. Aggregated on AIWithGhost for educational purposes — full credit and traffic to the original publisher.