Export an image from a design tool and you will see labels like PNG-8, PNG-24, and PNG-32. Each stores color differently, and the choice changes file size and whether you keep soft edges. PNG-8 uses a limited set of up to 256 colors, which suits flat graphics. PNG-24 stores truecolor with about 16.7 million colors but no alpha. PNG-32 adds an 8-bit alpha layer for smooth opacity. Pick the wrong one and a soft shadow turns jagged or a simple logo becomes unnecessarily heavy.
What is PNG-8?
PNG-8 is an indexed image format. It stores up to 256 colors in a table, and each pixel points to one of those colors. Because the color count is limited, PNG-8 files are much smaller than truecolor PNGs. Use PNG-8 for logos, icons, interface elements, and any graphic with few distinct colors.
Indexed Color vs Truecolor
Indexed color stores colors as a list. Truecolor, used by PNG-24 and PNG-32, stores red, green, and blue values for every pixel. Photographs and complex gradients need truecolor to avoid banding. For simple graphics, indexed color gives excellent quality at a fraction of the file size.
PNG-8 Alpha
PNG-8 can include per-color alpha through the tRNS chunk, so an individual color entry can carry its own opacity level. The spec allows smooth alpha inside an indexed image. Editors handle this unevenly. Photoshop's Save for Web PNG-8 option supports only on/off transparency, not the per-color alpha the PNG specification permits.
What is PNG-24?
PNG-24 is truecolor. It uses 8 bits for each red, green, and blue value, producing about 16.7 million possible colors. This format has no alpha layer, so it cannot store soft edges or transparent areas. Choose PNG-24 when you need full color depth and no see-through regions. Photographs, detailed illustrations, and web graphics on a solid background fit here.
What is PNG-32?
PNG-32 is truecolor plus an 8-bit alpha layer, or RGBA. Those extra 8 bits store opacity for every pixel, allowing smooth gradients from fully clear to fully solid. Use PNG-32 when your image needs partial see-through areas: drop shadows, soft edges, or overlays on a webpage. The file size is larger than PNG-24 because of the added alpha data.
PNG-32 is PNG-24 with an alpha layer. If you need soft edges, export as PNG-32.
How the Choice Affects File Size
Color count and alpha data directly affect file size. Here is the practical comparison:
- PNG-8: Smallest file size, especially for images with few colors. A graphic with a limited number of colors compresses well.
- PNG-24: Larger than PNG-8 because every pixel stores three bytes of color data. No alpha overhead.
- PNG-32: Largest of the three because every pixel stores four bytes: red, green, blue, and alpha.
For a typical web graphic, switching from PNG-32 to a well-chosen PNG-8 color set can cut file size by up to a large amount. Lossy PNG compressors work this way: they convert PNG-24 and PNG-32 images to well-chosen PNG-8 palettes, trading some color accuracy for a much smaller file.
When to Export PNG-8 or PNG-24
Decide between PNG-8 and PNG-24 by looking at image content and whether you need soft edges.
Export PNG-8 when:
- The image uses a limited color set: logos, icons, charts.
- File size matters and you can accept slight color reduction.
- You want smooth alpha, but only if your editor supports per-color alpha. Many do not.
Export PNG-24 when:
- The image has many colors, such as a photograph or gradient.
- You need no see-through areas.
- You want maximum color fidelity without an alpha layer.
If you need soft edges, choose PNG-32. If you need the smallest possible file and can accept a limited color set, choose PNG-8.
Transparency Handling in Different Editors
Design tools do not handle PNG-8 alpha the same way. The PNG specification allows indexed images to have per-color alpha through the tRNS chunk, which creates smooth opacity. Some popular editors limit this.
Photoshop's Save for Web PNG-8 option supports only on/off alpha. Each pixel is either fully clear or fully solid. Export a PNG-8 with a soft shadow from Photoshop and the shadow appears as a hard edge. To keep smooth opacity, export as PNG-32 instead.
Other editors may support full per-color alpha for PNG-8. Check your software's export settings for "transparency" or "alpha" options on indexed PNGs.
What About 16-Bit PNG?
PNG also supports 16 bits per color value, mainly for editing and print workflows. A 16-bit image stores far more color information than 8-bit, but the file size is much larger. Web browsers and most web software do not support 16-bit PNG, so keep these files for archival or professional printing. For almost all web use, 8-bit color depth in PNG-24 or PNG-32 is enough.