All formats
SVG vs PNG
SVG is vector: it stays sharp at any size and is usually a few kilobytes for a logo or icon. PNG is pixels, so it blurs when scaled up. Use SVG for logos, icons and diagrams. Use PNG for photographs and anything with real-world detail.
Side by side
| Spec | SVG | PNG |
|---|---|---|
| Type | Image | Image |
| Extensions | .svg | .png |
| Introduced | 2001 | 1996 |
| Compression | None | Lossless |
| MIME type | image/svg+xml | image/png |
| Use it when | Logos, icons, charts and illustrations that must stay sharp on any screen. | Screenshots, logos, icons, images with transparency, or any master file you will edit again. |
| Avoid it when | The source is a photograph, or the destination cannot render vectors. | Publishing large photographs to the web, where WebP or AVIF will be far smaller at the same quality. |
Where the usual answer breaks
SVG is code, so an untrusted SVG can carry scripts. Convert to PNG when accepting artwork from strangers.
SVG
- Resolution independent, sharp at any size or zoom
- Very small for logos, icons and diagrams
- Editable as text, scriptable, and styleable with CSS
- Unsuitable for photographs
- Complex files can be slow to render
- Can carry scripts, so treat SVGs from untrusted sources with care
PNG
- Lossless, so quality never degrades across saves
- Full 8-bit alpha transparency
- Excellent for text, screenshots, logos and flat colour
- Much larger than JPG or WebP for photographs
- No native animation support in practice (APNG is a separate extension)
Tools for these formats
Other comparisons
Last updated 2026-08-03