Image Compressor
Compress JPEG, PNG, and WebP images with a live before/after slider. Cap maximum width, pick output format, and export every file in one ZIP. Runs entirely in your browser — no upload, no watermark.
Output format
Lossy: quality slider sets compression.
Downscale if image exceeds this width. Aspect ratio preserved.
Background (JPEG has no alpha)
Compression you can actually inspect
Most online compressors hand back a single “compressed” file and ask you to trust the result. This tool exposes the trade you're making: a draggable split slider overlays the original and the compressed image so you can see exactly where artifacts show up — soft edges, banded gradients, color blocking — before you commit to a quality setting.
Pair that with live total-savings figures and a per-file percentage delta and the right quality value becomes obvious in seconds, not by guesswork.
JPEG, WebP, or PNG — which to pick
| Format | Lossy? | Transparency | Best for |
|---|---|---|---|
| JPEG | Yes | No | Photos, anything without transparency. Smallest at the same perceived quality. |
| WebP | Yes (lossy mode) | Yes | Web delivery, screenshots with UI, photos with alpha. Typically 25–35% smaller than JPEG at the same quality. |
| PNG | No | Yes | Logos, line art, icons. Quality slider has no effect — use the max-width cap to shrink instead. |
How quality, dimensions, and file size relate
File size is driven by two levers: the number of pixels (the resolution) and how aggressively those pixels are compressed (the quality). Quality alone has diminishing returns — below about 60% the perceptual loss outpaces the size savings. Cutting the resolution in half reduces pixel count by 75% and almost always produces a bigger win than turning quality down further.
That's why this tool exposes a Max width setting alongside quality. For website images, capping at 1600–2000 px width before compressing is usually the single biggest size improvement you can make.
Recommended starting points
- Web hero images: WebP at 80% quality, max width 1920–2400 px. Drops typical JPEGs by 70–80%.
- Product photos / e-commerce: WebP or JPEG at 85% quality, max width 1600 px. Visual quality still excellent; file usually under 200 KB.
- Email attachments: JPEG at 70–75%, max width 1200–1600 px. Keeps attachments small enough to slide past most inbox filters.
- Print-bound images: JPEG at 95% quality, no resolution cap. Trade compression for fidelity since print resolves more detail than screen.
- Screenshots with UI text: WebP or PNG. JPEG's color subsampling smudges sharp edges around text.
About the slider and privacy
The split slider clips the compressed image with a CSSclip-pathso you're looking at pixel-for-pixel side-by-side, not a re-rendered thumbnail. That's why you can spot JPEG ringing, WebP smoothing, and PNG's lossless preservation with confidence.
All compression runs locally in your browser through the Canvas API. The ZIP is built by JSZip in memory and saved directly by your browser. No file ever leaves your device.