Compress images in your browser. No uploads, no server — 100% private.
Browser-side image compression re-encodes your image using the HTML5 Canvas API entirely inside your browser tab — no file ever leaves your device. The technique draws the original image onto an off-screen canvas, then calls canvas.toBlob() with a quality parameter between 0 and 1. For JPEG and WebP outputs, this quality setting directly controls the DCT quantization table, trading fine detail for smaller byte size. PNG output is always lossless — only metadata and color palette optimization reduce file size for PNG inputs.
For most photographs, a quality of 75–85% produces output that is visually indistinguishable from the original at typical screen densities, while reducing file size by 50–80%. This tool defaults to 80%, which is the industry-standard web quality setting used by services like Google PageSpeed Insights and Squoosh.
PNG compression is lossless — the Canvas API re-encodes the PNG with its own internal filter and compression settings, which may differ from the tool that originally optimized your PNG. If your original was already heavily optimized with tools like pngcrush or oxipng, the Canvas re-encoding can produce a slightly larger output. In this case, switching the output to WebP will give you a smaller file with equivalent quality.
No. Everything happens inside your browser. The tool uses the FileReader API to read your image into memory, the Canvas API to redraw and compress it, and the Blob API to create a download link — all within your browser tab. Zero network requests are made. You can verify this by disconnecting from the internet after the page loads and confirming the tool still works.
The limit depends on your browser's available memory. In practice, images up to 20–30MB (e.g., RAW camera exports converted to JPEG) process without issues in modern browsers. Very large files (50MB+) may cause the browser tab to run out of memory on low-RAM devices. Processing is done one image at a time in the rendering pipeline, so uploading many large images simultaneously may be slow.
Download the compressed files and place them in your public/ or assets/ directory. In Next.js, use the built-in <Image> component which handles additional optimization at request time. In Nuxt 3, use @nuxt/image which integrates with Cloudinary, Imgix, or local sharp-based resizing. For static sites, the compressed files from this tool are often good enough without additional pipeline processing.