Overview
Introduction
This tool optimizes a PNG for a smaller file size by reducing its color complexity rather than its dimensions, entirely in your browser.
It works on a plain pixel buffer, so nothing you upload is sent to a server.
What Is PNG Optimizer?
A file-size optimization tool that quantizes each RGB channel to a coarser set of values and zeroes the color data of fully transparent pixels, both of which make the underlying byte stream more repetitive and therefore more compressible.
It's a thin, framing wrapper around this category's shared PNG compressor logic.
How PNG Optimizer Works
Each RGB channel value is rounded to the nearest multiple of a step size derived from the chosen level (1-9): `level * 8`. Coarser steps mean fewer distinct byte values, which compress better.
Fully transparent pixels (alpha 0) additionally have their RGB bytes zeroed, since their exact color is invisible but still takes up space in the uncompressed buffer.
When To Use PNG Optimizer
Use it before embedding a PNG in a web page or app where load time and bandwidth matter, especially for images with large flat-color or gradient areas.
It's most effective on graphics, illustrations, and screenshots; photographs with lots of natural color variation see a smaller benefit.
Often used alongside PNG Compressor, PNG File Size Reducer and PNG Quantizer.
Features
Advantages
- Runs entirely client-side; nothing you upload leaves your device.
- A single level control balances file size against visual fidelity.
- Reports the before/after unique color count so you can see the effect numerically, not just visually.
Limitations
- It doesn't touch image dimensions; pair it with the downscaler if you also need smaller pixel dimensions.
- Higher levels introduce visible color banding, especially in smooth gradients.
Examples
Best Practices & Notes
Best Practices
- Start at a low-to-mid level (2-5) and only increase if you need a smaller file and can tolerate visible banding.
- Check the reported unique-color counts before and after to gauge how aggressive the optimization was.
Developer Notes
The lib function is a thin, validating wrapper around `compressPng`, which does the actual channel-quantization and transparent-pixel-zeroing work; this tool just exposes it under the more familiar 'optimizer' framing users expect from image tools.
PNG Optimizer Use Cases
- Shrinking a PNG before adding it to a web page for faster load times
- Reducing storage size for a large batch of exported graphics
- Trading a small amount of color fidelity for a meaningfully smaller file
Common Mistakes
- Using the maximum level on a photo-like image and getting distracting color banding.
- Expecting dimension changes — this tool only reduces color complexity, not pixel dimensions.
Tips
- Combine with the downscaler tool for the smallest possible file when dimensions can also shrink.
- Compare the unique color count report at a few different levels to find the best size/quality tradeoff for your image.