PNG vs SVG
Um comparativo detalhado de PNG Image e SVG Vector Image — tamanho de arquivo, qualidade, compatibilidade e qual escolher de acordo com seu fluxo de trabalho.
PNG Image
Raster & Vector ImagesPNG is a lossless image format that supports transparency. It is ideal for graphics, logos, screenshots, and any image where preserving exact pixel data is important.
Sobre os arquivos PNGSVG Vector Image
Raster & Vector ImagesSVG is an XML-based vector image format that scales to any resolution without quality loss. It is the standard for web icons, logos, and illustrations that need to look sharp on all screen sizes.
Sobre os arquivos SVGComparativo de vantagens
PNG Vantagens
- Lossless compression — every save preserves the original pixels perfectly.
- Full 8-bit alpha channel for smooth transparency.
- Excellent for text, UI screenshots, logos, and line art.
- Royalty-free and an ISO standard (ISO/IEC 15948).
- Supports 16-bit color depth for high-fidelity work.
SVG Vantagens
- Resolution-independent — crisp at any size, from 16px icon to 4K billboard.
- Tiny file sizes for flat graphics, logos, and UI illustrations.
- Editable with any text editor; programmatically manipulable via DOM.
- Supports interactivity, CSS styling, and JavaScript inside the image.
- Accessible — text inside SVG is readable by screen readers.
Limitações
PNG Limitações
- Much larger than JPEG for photographs (no perceptual compression).
- No native animation in most software (APNG support is inconsistent).
- No CMYK support — web and screen only, not print.
- Metadata capabilities are less rich than JPEG's EXIF.
SVG Limitações
- Not suitable for photographs or complex raster imagery.
- Uploading user-provided SVG is risky — embedded scripts are an XSS vector.
- Complex SVGs with thousands of paths render more slowly than a PNG equivalent.
- Inconsistent rendering across browsers for edge-case features (filters, gradients).
- No native concept of layers or groups for design-tool round-tripping.
Especificações técnicas
| Especificação | PNG | SVG |
|---|---|---|
| MIME type | image/png | image/svg+xml |
| Compression | Lossless — DEFLATE (zlib) | Gzipped variant is .svgz |
| Color depth | 1, 2, 4, 8 or 16 bits per channel | — |
| Max dimensions | 2^31 − 1 pixels per side (2.1 billion) | — |
| Transparency | Full 8-bit alpha channel | — |
| Standard | ISO/IEC 15948:2004 | — |
| Format | — | XML (text-based) |
| Current version | — | SVG 2 (W3C Recommendation, 2018) |
| Resolution | — | Unlimited (vector) |
| Animation | — | SMIL, CSS, JavaScript |
Tamanhos típicos de arquivo
PNG
- Icon or small logo 2–20 KB
- UI screenshot (1920×1080) 200–800 KB
- High-res photo (12 MP) 10–30 MB
- Print-ready illustration 5–50 MB
SVG
- Simple icon 200 B – 2 KB
- Company logo 2–10 KB
- Complex illustration 20–100 KB
- Data-visualization chart 50–500 KB
Pronto para converter?
Converta entre PNG e SVG online, grátis e sem instalar nada. Upload criptografado, exclusão automática em 60 minutos.
Perguntas frequentes
PNG (Portable Network Graphics) is a lossless raster image format created in 1996 as a patent-free alternative to GIF. It supports transparency, making it ideal for logos, icons, and web graphics.
PNG (Portable Network Graphics) is a sem perdas raster image formato created in 1996 como um patent-free alternative to GIF. It suporta transparência, making it ideal para logos, icons, e web graphics.
PNG files open natively in all modern operating systems, web browsers, and image editors including Photoshop, GIMP, Paint.NET, and Canva.
PNG arquivos abrir natively in all moderno operating systems, web browsers, e image editors including Photoshop, GIMP, Paint.NET, e Canva.
WebP offers 26% smaller file sizes than PNG with equivalent quality. Use WebP for web delivery when browser support is sufficient. Use PNG when maximum compatibility or professional editing workflows are needed.
WebP oferece 26% smaller tamanho do arquivos than PNG com equivalent quality. usar WebP para web delivery when browser support is sufficient. usar PNG when máximo compatibilidade ou profissional editando workflows are needed.