JPG, PNG or WebP? How to Pick the Right Image Format
2026-07-20
Most people compress an image, see it barely shrink, and conclude the tool did not work. Usually the tool worked fine — the format was wrong for the job. Picking correctly often does more than any quality slider.
The one distinction that matters
Every image format is either lossy or lossless.
Lossy formats permanently discard data your eye is unlikely to miss, mostly subtle colour variation. You get a much smaller file and can never get the original detail back. JPG and WebP work this way.
Lossless formats rewrite the data more efficiently without throwing anything away. Every pixel survives exactly, so files stay larger. PNG works this way.
That single difference explains most confusion. Compressing a PNG screenshot at "50% quality" does very little, because PNG has no quality dial to turn.
When to use each
JPG — photographs. Anything with gradual colour transitions: faces, landscapes, food, product shots. JPG was designed for exactly this and handles it better than anything else at the same file size. Do not use it for screenshots or logos.
PNG — screenshots, logos, diagrams, anything with sharp edges or text, and anything needing transparency. JPG cannot store transparency at all, and it smears text into visible fuzz. A screenshot saved as JPG looks noticeably worse than the same shot as PNG, often at a larger file size.
WebP — the modern option that does both. It supports lossy and lossless modes plus transparency, and typically lands 25 to 35 percent smaller than JPG at equivalent quality. Every current browser supports it. The catch is outside the browser: some older desktop software and a few upload forms still reject it, so keep a JPG copy if the file has to travel.
Quick version:
| You have | Use | Why |
|---|---|---|
| A photo for the web | WebP, or JPG for compatibility | Lossy handles gradients well |
| A screenshot | PNG | Keeps text sharp |
| A logo with transparency | PNG or WebP | JPG has no transparency |
| A photo to print | JPG at 90%+ | Print reveals artifacts |
What the quality number actually does
On a lossy format, quality controls how aggressively data is discarded. The relationship is not linear, and that surprises people.
- 90–100% — near-indistinguishable from the original, but files stay large. Use for print.
- 75–85% — the sweet spot. Most photos look identical on screen at roughly a third of the original size.
- 60–70% — visible on close inspection, fine for messaging apps and thumbnails.
- Below 50% — obvious blocky artifacts around edges and in flat areas like sky.
Start at 80 and move down only if you need to.
The mistake that quietly ruins images
Never compress an already-compressed file repeatedly. Each lossy pass discards data based on what survived the previous one, so artifacts compound. A photo saved at 70% three times looks considerably worse than the same photo saved once at 50%, even though the final number is higher.
Always go back to the original when you need a different size. This is also why an image that has been through several messaging apps looks so degraded — each app re-encoded it.
Trying it
The Image Compressor shows the output size updating as you move the slider, so you can find the point where the size drops but the picture still holds up. If you need to change format rather than just size, the Image Converter handles conversion between JPG, PNG, WebP and about twenty others.
Both run entirely in your browser. Nothing is uploaded, which also means there is no file size cap beyond what your own device can handle.