Image Compressor — Target File Size & Side-by-Side Preview

Compress JPG, PNG and WebP images directly in your browser — nothing is uploaded to any server. Furthermore, a unique target file size input lets you specify a maximum output size in kilobytes — the tool auto-adjusts quality to hit the target. Choose between quality slider mode and target size mode, then preview before and after side by side.

How to use the Image Compressor

Quality slider versus target file size mode

Quality slider mode gives direct control over the compression level. Furthermore, it suits users who understand the quality-size trade-off and want predictable, repeatable settings for a workflow. Target file size mode suits a different use case — when the output must meet a specific limit regardless of the visual quality result. Moreover, a web hosting platform with a 300 KB image limit or an email service with a 500 KB attachment limit both require target file size control rather than manual quality adjustment.

Output format comparison

JPG compresses photographs efficiently but discards detail using lossy compression. Furthermore, PNG uses lossless compression — file sizes are larger but no detail is lost. WebP offers better compression than JPG at equivalent quality in most cases. Moreover, WebP is supported by all modern browsers and produces 25–35% smaller files than JPG at the same perceived quality.

How target file size compression works

The target size algorithm uses binary search to find the quality level that produces output closest to the target. Furthermore, it tries a mid-point quality, checks the result size and narrows the search range until the output is within 2% of the target.

Worked example: compressing a hero image to 200 KB

A web developer has a 1.8 MB photograph to use as a website hero image. Their hosting platform limits images to 200 KB for performance. Using target file size mode:

What is image compression?

Image compression reduces the file size of an image by removing or encoding redundant data. Furthermore, lossy compression — used by JPG and WebP — permanently discards some image data to achieve smaller sizes. The human eye tolerates moderate quality reduction without noticing a difference. Moreover, lossless compression — used by PNG — encodes the data more efficiently without discarding any information. The choice depends on whether preserving every pixel detail matters for the specific use case.

Web performance guidelines recommend keeping page images under specific size thresholds. Furthermore, Google's Core Web Vitals metrics — Largest Contentful Paint in particular — are directly affected by image file sizes. A 2 MB hero image delays the LCP score significantly. Moreover, image compression is the single highest-impact optimisation for most web pages. Studies show that images account for over 60% of average page weight across the web.

Lossy versus lossless compression

Lossy compression removes visual data that the human visual system is least sensitive to — typically high-frequency detail in smooth areas. Furthermore, the compression artefacts from lossy compression are most visible in areas of sharp colour transitions and text overlaid on images. Lossless compression uses techniques like run-length encoding and Huffman coding to represent the same pixel data in fewer bytes. Moreover, photographs compress best with lossy methods, while screenshots and diagrams with sharp edges often compress better with lossless PNG.

Why browser-based compression protects privacy

Server-based image tools upload your image to an external service for processing. Furthermore, this creates privacy concerns for images containing personal content — family photos, ID documents and internal business materials. Browser-based compression processes images entirely within your browser — the file never leaves your device. Moreover, this approach removes the latency of uploading a large file to a server and waiting for a response. The compression result is instantaneous regardless of internet connection speed.

Core Web Vitals and image optimisation

Google's Core Web Vitals scoring penalises pages with large image payloads. Furthermore, the Largest Contentful Paint element — usually the hero image — should load within 2.5 seconds for a "Good" score. A 2 MB uncompressed hero image on a typical mobile connection takes 4–6 seconds to load. Moreover, compressing the same image to under 200 KB reduces load time to under 1 second — moving the page from "Poor" to "Good" on the LCP metric without any code changes.

Frequently asked questions

Related tools