Images

JPG vs PNG vs WEBP: which image format should you use?

The same picture can be 300 KB as a JPG and 2 MB as a PNG. Each format is good at different things — here's how to choose.

At a glance

FormatCompressionTransparencyBest for
JPGLossyNoPhotos, uploads, email
PNGLosslessYesLogos, icons, screenshots
WEBPLossy or losslessYesWebsites and blogs
GIF256 colorsOn/off onlyTiny animations
SVGVectorYesLogos and icons

Lossy vs lossless

JPG throws away detail your eyes barely notice — that's lossy compression. Photos shrink dramatically, but every re-save loses a little more. PNG keeps every pixel exactly (lossless), so flat-color graphics and screenshots compress well, while photos stay large.

That's why a text screenshot saved as JPG gets smudgy halos around the letters, and a phone photo saved as PNG balloons in size — the formats are swapped.

What to pick

Photos on a website → WEBP (25–35% smaller than JPG), or JPG where WEBP isn't accepted.

Logos on a website → SVG if you have it, otherwise PNG with a transparent background.

Screenshots → PNG.

Forms and uploads → JPG — practically everything accepts it.

Print → full-resolution JPG or PNG; vectors for logos.

Switch formats in bulk with the image converter.

Two common myths

"Converting to PNG improves quality." No — detail lost in a JPG doesn't come back. PNG just stops it getting worse.

"Setting 300 DPI makes it print sharper." DPI is only a label. Print sharpness depends on the pixel count: an 8×10 inch print at 300 DPI needs 2400×3000 pixels.

Written by · Fingertip Workshop

I got tired of searching for the same small computer chores, so I started building the tools myself. Every tool here is used and refined before it goes on the shelf, and every guide comes from a real problem.