Skip to content

Which image format should you use?

There is one question that decides it, and almost everything else follows. Most of the bad choices people make come from answering a different question instead.

Last reviewed

The question that decides it

Is the picture made of continuous tone, or of flat areas and sharp edges?

A photograph is continuous tone: millions of subtly different colours, no two adjacent pixels quite the same, and no hard boundaries except at object edges. A screenshot, a logo, a chart, a diagram or a line drawing is the opposite: large areas of identical colour meeting at perfectly sharp boundaries.

Every image format is built for one of those and is bad at the other. Lossy formats — JPEG, and WebP or AVIF in their lossy modes — throw away detail the eye is poor at noticing, which works beautifully on continuous tone and puts visible fringing around every sharp edge. Lossless formats — PNG, and WebP or AVIF in their lossless modes — compress by finding repetition, which works beautifully on flat colour and barely at all on photographic noise. Choosing the wrong one makes the file either ugly or enormous, and usually people notice only one of the two.

The short answers

A photograph going to a person, an email or an old system: JPG at quality 85ish. Universally readable, small, and the loss is invisible at that setting.

A screenshot, logo, chart or diagram: PNG. Every edge stays exactly sharp, and flat areas compress to almost nothing. If it has transparency, PNG is also the only one of the two classic formats that can carry it.

Anything going on a web page you control: WebP, or AVIF if you can afford the encoding time. Both do the job of JPG and PNG better — WebP has lossy and lossless modes and carries transparency in both, and AVIF stores a photograph at roughly half the size of an equivalent JPEG.

A logo or an icon: SVG if you have it, because it stays sharp at every size and is usually smaller than any pixel version. Rasterise it only for the places that cannot read vectors — favicons, social preview images, email and app stores.

What each format cannot do

The limits are more useful than the feature lists, because they are what catches people out.

JPG has no transparency. None, and it never will. Converting a PNG with a transparent background to JPG fills that background with a solid colour — which is why a logo saved as JPG arrives in a white box. It is also lossy every single time it is saved, so editing and re-saving the same JPG repeatedly degrades it a little further on each pass.

PNG is terrible at photographs. Not wrong — lossless and faithful — but enormous, because photographic noise defeats the prediction it compresses with. A PNG of a photograph is routinely ten times the size of the JPEG nobody could distinguish from it.

WebP has a hard ceiling of 16,383 pixels on either side, which is generous for photographs and restrictive for a panorama, a full-page screenshot of a long web page, or a scanned map.

AVIF is slow to encode. Seconds per large photograph, because it is a still frame of video compression and the searching is what buys the size. Decoding is instant, which is the right trade for something encoded once and viewed often.

Where the compatibility line actually falls

This is where advice tends to be years out of date in both directions. Every current browser reads WebP and AVIF, and has for years — so for a website, the compatibility argument against them is finished. Serving AVIF with a JPEG fallback through a picture element removes even that concern.

Outside the browser it is a different picture, and this is the part people get wrong in the other direction. Older email clients, plenty of desktop image viewers, a great deal of enterprise software and most print workflows still do not read WebP or AVIF reliably. So the rule is about the destination rather than the year: newer formats for a web page you control, JPG or PNG for a file you are handing to a person or a system.

Converting does not undo damage

The most common misunderstanding about image formats is worth stating directly: converting a lossy file to a lossless one does not recover anything. Turning a JPG into a PNG preserves the JPEG's artefacts perfectly — the blocking, the ringing around text, the colour smear on saturated edges — because by then those are pixel values and indistinguishable from picture content. The PNG is larger and contains exactly the same visible damage.

It is still worth doing at the right moment. Converting to PNG before a round of editing means every subsequent save is free, where editing and re-saving a JPG degrades it each time. Do it at the start of the work, not after four rounds of saving.

The same logic applies going the other way. Encoding to AVIF or WebP from a JPEG means the new encoder inherits the old one's artefacts and spends real bits preserving them — so a file encoded once from the original is both smaller and better than one encoded twice. Always start from the best version you have.

Frequently asked questions

What quality setting should I use for JPG?

Around 85 is the point where most people stop being able to see the difference, and it is where the size curve flattens — going higher costs a lot of bytes for very little. Below about 70, artefacts become visible on smooth gradients like skies first.

Is WebP lossy or lossless?

Both — it is two formats sharing an extension, and the quality setting picks. Anything below maximum gives you lossy WebP, which is excellent for photographs and wrong for screenshots of text, where the subsampled colour fringes every sharp edge. Maximum gives lossless.

Why is my PNG bigger than the JPG it came from?

Because PNG compresses by predicting each pixel from its neighbours, and JPEG artefacts look like noise to that prediction. A JPG of foliage or fur makes an enormous PNG; a JPG of a screenshot makes a modest one.

Should I still use GIF for anything?

Only for animation, and even then a short video or an animated WebP is dramatically smaller and smoother. For still images GIF is limited to 256 colours and one bit of transparency, so its edges are jagged and its colours approximate — a PNG is better in every respect.

Does converting between formats lose quality every time?

Every pass through a lossy encoder does, and it never comes back. Lossless conversions — PNG to lossless WebP, BMP to PNG — do not. The rule that avoids most trouble: keep one high-quality original, and generate delivery copies from it rather than from each other.