When to use PNG

PNG is lossless and supports transparency. Everything about when to use it follows from those two facts.

Use it when you need transparency

Logos over coloured backgrounds, icons, cut-out product shots, anything with rounded corners. JPG has no alpha channel at all — converting a transparent image to JPG flattens it onto a solid colour permanently.

Use it for text and sharp edges

Screenshots, diagrams, charts, line art, UI mockups. Lossless compression keeps every edge exactly as drawn, and hard black-on-white edges are precisely what JPEG handles worst — it puts a grubby halo around every letter.

PNG is also genuinely efficient here. Large areas of flat identical colour are exactly what lossless compression is good at, so a screenshot of a document is often smaller as PNG than as JPG, as well as looking better.

Use it for working files

If you will open, edit and re-save an image several times, PNG loses nothing on each round trip. A JPEG degrades every single time it is saved.

Do not use it for photographs

This is the common mistake. A photograph has almost no exact repetition for lossless compression to find, so PNG stores it close to raw — routinely five to ten times a JPG of the same photo, with no visible difference. It is the single most frequent cause of a slow-loading web page.

Mistakes worth avoiding

• Saving photographs as PNG "to keep the quality". The quality was already fine; the file is now enormous.
• Converting an existing JPEG to PNG. It cannot undo the compression already applied.
• Expecting the quality slider to shrink a PNG. PNG has no quality setting.