The short answer
Use JPG for photographs. Use PNG for graphics, logos, screenshots, and anything with transparency.
That rule handles 90% of cases correctly. The rest of this post is about why it works, what happens when you get it wrong, and the edge cases where the rule breaks down.
What JPG actually does to your image
JPG uses lossy compression — it permanently discards visual information to make the file smaller. The algorithm exploits the fact that human eyes are less sensitive to fine color detail than to brightness differences. So it blurs color slightly, which you barely notice in a photograph, and drops that data entirely.
The result: a 4 MB photo from your phone might compress to 300 KB as a JPG at quality 85, with no visible difference when viewed at normal size. That's why every photo on the web is a JPG.
The problem is sharp edges. When JPG compresses a graphic with hard borders — text on a white background, a logo with crisp lines — those edges become fuzzy. You get a halo of compressed artifacts around every sharp transition. On a photograph it's invisible. On a logo it looks terrible.
What PNG does instead
PNG uses lossless compression — it makes the file smaller without discarding any information. Every pixel in the original is preserved exactly. When you open the file and save it again, the pixel values are identical.
For graphics with flat colors, solid fills, and sharp edges, PNG compression is extremely effective — a logo with a transparent background might be 50 KB as a PNG and look perfect. The same logo as a JPG would be smaller but have visible artifacts around the text.
For photographs, PNG is a disaster. A photo that is 300 KB as a JPG might be 3–5 MB as a PNG. The lossless compression doesn't help much with the complex, noisy pixel data in a photograph. You get a huge file with no visible quality improvement.
The transparency rule
JPG does not support transparency. If you have an image that needs a transparent background — a logo to overlay on a colored header, a product image for an e-commerce site, an icon for a UI — it must be a PNG (or WebP).
If you save a transparent image as a JPG, the transparent areas become white. You then can't use that image on anything except a white background.
The exception that catches most developers
The trap: you have a logo with a transparent background, so you correctly save it as a PNG. But then someone places it on a dark blue background and the edges look wrong — a faint white halo around the logo. What happened?
The logo was previously exported with white background anti-aliasing. The edges of the letters were blended with white before the background was made transparent. When placed on dark blue, those blended white pixels show up as a halo.
The fix: export the original SVG or vector file against a transparent background from scratch, or against the target background color. The format was right (PNG); the export process was wrong.
What about WebP?
WebP is Google's modern format that is smaller than both PNG and JPG at equivalent quality. It supports transparency (like PNG) and lossy compression (like JPG). All major browsers support it now.
The practical limitation: email clients, many design tools, and older systems don't handle WebP. For the web, WebP is excellent. For anything that goes beyond a browser (email, Slack, apps, print), stick with PNG or JPG.
You can convert between formats — JPG to WebP, PNG to WebP, and back — using the free image converter.
Quick decision table
| Situation | Use |
|---|---|
| Photograph for a website | JPG |
| Logo with transparent background | PNG |
| Screenshot of UI or code | PNG |
| Hero image or background photo | JPG (or WebP) |
| Icon or graphic with flat colors | PNG (or SVG) |
| Product image on white background | JPG |
| Product image with transparent bg | PNG |
| Email attachment (any photo) | JPG — keep under 1MB |
File size at a glance
As a rough benchmark: a 2000×1500 pixel photograph is typically 300–600 KB as JPG at quality 85, and 3–8 MB as PNG. A 500×500 pixel logo with transparency is typically 30–100 KB as PNG, and would be a similar size as JPG but with edge artifacts and no transparency.
If you need to reduce a JPG's file size further without switching formats, the free image compressor lets you adjust quality and see the file size result in real time.
When you receive the wrong format
If a client sends you a logo as a JPG, don't just convert it to PNG — the JPG artifacts are already baked in. Ask for the original vector (SVG, AI, EPS) or a clean PNG export from the source file. Converting a JPG to PNG just gives you a large file with the same JPG artifacts preserved losslessly.
Summary
- JPG: photos, backgrounds, anything where transparency is not needed and file size matters
- PNG: logos, graphics, screenshots, anything with transparency or sharp edges
- WebP: modern web contexts where you control the environment and need the smallest files
Need to convert between formats? Convert JPG to PNG, PNG to WebP, or any other combination free in your browser — no upload required.