How to compress images without losing visible quality
Compression trades file size against detail. Most images can lose more than their owner expects, as long as you decide what good enough means before you start rather than afterwards.
What the two modes actually do
Quality mode re-encodes the image once at a fixed quality. Target-size mode lowers the quality step by step until the file fits the number you typed.
Both are lossy for JPG and WebP: pixels are discarded and cannot be recovered from the result. PNG output keeps every pixel, which is also why a PNG screenshot often stays large no matter what quality you select.
Judge at full size, not in a thumbnail
Look at a face, a text edge or a strong diagonal at full size. That is where compression loss hides, and a small preview hides it right back.
The before and after preview shows the original and the result side by side at the same scale, so the difference you see is the difference you would publish.
Work towards a limit, not a number
Most destinations impose a maximum: 2 MB for an upload form, 200 KB for an avatar, 5 MB for a marketplace photo. Type that limit into target-size mode instead of guessing a quality percentage.
A target is best effort. When the browser cannot reach it, PixelKit keeps the real result and tells you the size it did reach, rather than silently shipping a file over the limit. When that happens, resize first.
Resize before you compress
If the image will be displayed 1600 px wide, no quality slider will match what removing the extra pixels achieves. Resize to the real display size, then compress that result.
Enlarging is the opposite: a bigger canvas adds bytes without adding detail, so keep the original size unless the destination demands more.
Where quality gets lost twice
Compressing an already compressed file discards detail a second time. Keep the original and compress once, from the original.
Turning a PNG screenshot into JPG to save space usually trades crisp text for smudges. Resizing it, or accepting the size, is often the better choice.
A repeatable workflow
- Find the limit the destination enforces
- Compress towards that limit from the original file
- Check the preview at full size and read the reported result size
- If the target was unreachable, resize to the display size and compress again
- Download and open the final file before uploading it
Try it here
- Compress images β Reduce JPG, PNG and WebP file sizes in your browser.
- Resize images β Scale images by width, height or percentage in your browser.