Compress PNG with Canvas and Optional Scaling
This tool loads a PNG, draws it to a browser Canvas sized according to the selected scale, and exports a PNG. At 100%, output dimensions match the Canvas dimensions; lower scale values reduce them. Canvas re-encoding can change pixel values, and output size depends on the image and browser encoder. A smaller or pixel-identical output is not guaranteed. This route does not use UZIP or browser-image-compression.
How to compress a PNG
- Choose or drop a PNG image.
- Keep scale at 100% for the same Canvas dimensions, or choose a lower scale to resize.
- Review dimensions, appearance, and file size; a smaller or pixel-identical output is not guaranteed.
- Download the copy if it meets your needs. The original is not modified.
Common use cases
- Create a resized PNG copy when smaller dimensions are acceptable.
- Compare Canvas re-encoding results before using a PNG.
Frequently asked questions
Does this tool use UZIP or browser-image-compression?
No. It draws the image to browser Canvas and exports a PNG.
Does 100% scale preserve every pixel?
It keeps the Canvas dimensions at the source dimensions, but Canvas decoding and re-encoding can change pixels.
What happens below 100% scale?
Output dimensions are reduced, changing the pixel grid and potentially image detail.
Will the PNG always be smaller?
No. File size depends on the input image and browser encoder. Lower scale reduces dimensions but does not guarantee a smaller file.
Does a quality setting affect PNG output?
This tool's relevant control is scale. It changes dimensions; Canvas re-encoding may also change pixels at 100%.
Scale changes dimensions; review the output
At 100% scale, the image is still decoded and re-encoded through Canvas, so pixels may change. At a lower scale, the pixel grid is reduced too. PNG's lossless format does not prevent pixel changes during drawing and resampling. Check dimensions, appearance, and file size before replacing the original.
- PNG output created through browser Canvas
- Optional scale control reduces output dimensions below 100%
- Before-and-after size comparison
- Browser-side processing; no image upload
Free. No signup. No file uploads. Ads via AdSense (consent required).
Sources (2)
- WHATWG (live). HTML Living Standard — Canvas 2D Context: drawImage() and HTMLCanvasElement.toBlob(). html.spec.whatwg.org/#dom-context-2d-drawimage + html.spec.whatwg.org/#dom-canvas-toblob — this route draws the decoded image to a Canvas sized from the selected scale and exports image/png; Canvas decode, resampling, and re-encoding can alter pixels, and file-size reduction is not guaranteed.
- W3C (PNG Working Group) (2003). Portable Network Graphics (PNG) Specification (Second Edition). W3C Recommendation 10 November 2003 / ISO/IEC 15948:2004 — PNG output format; the format's lossless encoding does not guarantee that pixels remain unchanged after an image has been decoded, resized, or re-encoded through Canvas.
These are the W3C, ISO/IEC, ITU-T, and IETF specifications the tool implements or builds on. Locate them on w3.org, iso.org, itu.int, or datatracker.ietf.org.