PNG vs JPG: which should you use?

The short answer

JPG for photographs. Anything from a camera or a phone, anything with soft gradients and no hard edges.

PNG for everything else. Screenshots, logos, icons, diagrams, charts, artwork with flat color, and anything that needs a transparent background.

The test that decides it in a second: does the image contain text or hard edges? If yes, PNG. If it is all soft detail and shading, JPG.

The one difference everything comes from

PNG is lossless. Every pixel is stored exactly. It compresses by noticing repetition, the way a zip file does, so a picture of large flat areas gets very small and a picture of noisy detail barely compresses at all. Save it, open it and save it again a hundred times and the last file is identical to the first.

JPG is lossy. It works on blocks of pixels and stores an approximation of what is in each one, discarding fine variation that the eye is bad at noticing. This is not a bug, it is the entire point, and it is extraordinarily effective: a photograph at high JPG quality is usually a fifth the size of the PNG and nobody can see the difference.

Where it falls apart is exactly where the eye is good at noticing: a hard boundary between two very different colors. Black text on white is the worst case in the world for this, which is why it is the case you see fail.

What each wrong choice actually costs

A photograph saved as PNG

Costs size, and a lot of it. A photograph is mostly noise at the pixel level, and noise is precisely what lossless compression cannot shrink. The same 12 megapixel photo that is 3MB as a JPG is routinely 20MB or more as a PNG, with nothing gained. On a web page that is the difference between a picture appearing and a visitor leaving.

If you have done this by accident, it is entirely recoverable: the PNG holds the full image, so the PNG to JPG converter gives you the small version with no additional loss beyond the single JPG encoding.

A screenshot saved as JPG

Costs quality, permanently. Look closely at text in a JPG screenshot and you will see a faint gray wash around the letters and sometimes colored speckles at the corners. Those are compression artifacts, the block-based approximation failing at a hard edge.

This one does not come back. Converting the JPG to PNG afterwards preserves the artifacts perfectly and just makes the file bigger. Re-take the screenshot if you can.

Transparency settles a lot of cases on its own

PNG supports transparency and JPG does not. There is no version of JPG that has it, no setting that enables it, and no way to add it.

So if you need a logo to sit on a colored background, a product cut out from its surroundings, or a sticker with nothing behind it, the choice is made before any of the quality argument starts. Save a transparent image as JPG and the transparent parts become white, immediately and without warning.

Going the other way is a common disappointment. Converting a JPG to PNG does not create transparency, because there was none to preserve. What you get is the same picture with its white background intact, now in a format that could have had transparency. Removing that background is a separate operation, and the white background remover does it if the background is genuinely white or close to it.

Converting between them

Both directions work, both run in your browser here, and neither uploads anything. What matters is knowing what each one does and does not do.

• PNG to JPG makes the file dramatically smaller and applies JPG compression once. Right for a photograph that was saved as PNG by mistake. It also flattens any transparency to white, so check for that first.
• JPG to PNG preserves what is there and makes the file larger. Right when you are about to start editing and want no further loss, or when something specifically requires PNG. It does not repair anything.

If size is the actual problem rather than format, converting is often the wrong lever. Compressing in place usually gets you further: compress JPG and compress PNG both cut size without changing what the file is.

The third option, which is usually the right one

For anything going on a website, WebP beats both. It does lossy compression like JPG, lossless like PNG, and transparency like PNG, at roughly 25 to 35 percent smaller than the equivalent. It works in every browser people actually use.

The reason not to use it everywhere is that outside the browser its support is patchier: some older software will not open one, and some upload forms still reject it. So the sensible rule is WebP on your own website, PNG or JPG when handing a file to somebody else.

There is a fuller explanation of WebP if you want it, and PNG to WebP converts without uploading. If the comparison you actually wanted was between the two spellings rather than two formats, that is JPG versus JPEG, and the answer there is that they are the same thing.

Frequently asked questions

What is the difference between PNG and JPG?

JPG throws information away to make the file smaller, and PNG does not. JPG's method works by blurring detail slightly in ways the eye tends not to notice in a photograph, which is why it is excellent for photographs and visibly bad for text and sharp edges. PNG keeps every pixel exactly, which makes it perfect for screenshots and logos and enormous for photos. PNG also supports transparency and JPG does not.

Should I use PNG or JPG for photos?

JPG, almost always. A photograph saved as PNG is typically five to ten times larger with no visible improvement, because PNG has to record every pixel of noise and grain individually while JPG can summarize them. The exception is a photo you plan to edit repeatedly, since every JPG save degrades it slightly and PNG never does.

Why does my text look blurry in a JPG?

Because JPG compresses by working on blocks of pixels and smoothing the differences inside them, and a hard black-on-white edge is the largest difference there is. The result is a faint gray halo around letters, often with colored speckles. It cannot be fixed after saving. Save screenshots and anything containing text as PNG.

Is PNG better quality than JPG?

PNG is lossless, so it is exact, but exact is not the same as better looking. For a photograph a good JPG is indistinguishable from the PNG at a fraction of the size, so calling PNG higher quality there is true and useless. For a screenshot or a logo the difference is immediately visible and PNG genuinely is better.

Does converting JPG to PNG improve quality?

No. Converting to PNG preserves whatever the JPG already contains, including its compression damage, and makes the file much larger to do it. The blur and the halos are baked into the pixels and there is nothing left to recover. Convert to PNG when you need transparency or lossless editing from that point on, not to undo something.

Which is better for a website?

Both, for different things: JPG for photographs, PNG for logos, icons and anything with transparency. Increasingly the answer is neither, since WebP does both jobs at roughly a third smaller and is supported everywhere that matters.