---
title: "PNG, WebP o SVG: Eligiendo el Formato Correcto para tu Código QR"
description: "Comparativa técnica entre PNG, WebP y SVG para códigos QR vía API. Sabé cuál formato usar según tu caso de uso: e-mail, impresión, web o apps."
keywords: "qr code png, qr code webp, qr code svg, formato imagen qr code, api qr code formato paraguay"
author: "QRRapido"
date: 2026-03-08
lastmod: 2026-03-08
image: ""
---

# PNG, WebP o SVG: Eligiendo el Formato Correcto para tu Código QR

La API QRRapido soporta tres formatos de salida: `png`, `webp` ha `svg`. Cada uno tiene características distintas que impactan el tamaño del archivo, la calidad ha la compatibilidad. Usá el parámetro `outputFormat` en la solicitud para elegir.

```json
{
  "content": "https://tuempresa.com.py",
  "type": "url",
  "outputFormat": "webp"
}
```

---

## Resumen Rápido

| Formato | Tamaño | Escala sin pérdida | Compatibilidad | Ideal para |
|---|---|---|---|---|
| **PNG** | Medio | No (raster) | Universal | Impresión, e-mail, sistemas legados |
| **WebP** | Pequeño (~30% menor) | No (raster) | Browsers modernos | Web, apps, APIs |
| **SVG** | Variable (generalmente menor) | **Sí** | Browsers, Adobe, Figma | Logos, banners, impresión vectorial |

---

## PNG — El Estándar Universal

PNG es un formato raster sin pérdida, ideal para códigos QR porque preserva 100% de los píxeles blancos ha negros sin introducir artefactos.

**Cuándo usarlo:**
- Envío por e-mail (clientes de correo antiguos no soportan WebP)
- Integración con sistemas legados
- Cuando la compatibilidad máxima es prioridad

**¿Por qué no JPEG?**

> JPEG usa compresión con pérdida que introduce artefactos de borrosidad en los bordes de los módulos del código QR. Eso puede volverlo ilegible, especialmente en tamaños pequeños. **Nunca usés JPEG para códigos QR.**

```json
{ "outputFormat": "png" }
```

---

## WebP — Recomendado para Web ha Apps

WebP es el formato porã para la mayoría de las integraciones modernas. La calidad visual es indistinguible del PNG para códigos QR, con **25–35% menos tamaño de archivo**.

**Ventajas:**
- Carga más rápida en páginas web
- Menor uso de ancho de banda en APIs con alto volumen
- Soporte nativo en todos los browsers modernos (Chrome, Safari 14+, Firefox, Edge)
- Menor consumo de almacenamiento en la nube (S3, GCS, etc.)

**Cuándo usarlo:**
- Visualización en `<img>` en sitios ha aplicaciones web
- Apps iOS/Android (ambos soportan WebP)
- Cuando almacenás los QR generados

```json
{ "outputFormat": "webp" }
```

Para mostrar en HTML:
```html
<picture>
  <source srcset="data:image/webp;base64,{{ qrCodeBase64 }}" type="image/webp">
  <img src="data:image/png;base64,{{ fallbackBase64 }}" alt="Código QR">
</picture>
```

---

## SVG — Para Escalar sin Pérdida

SVG es un formato vectorial: el código QR se describe matemáticamente, no como píxeles. Eso significa que se puede redimensionar a cualquier tamaño — desde un ícono de 16px hasta un banner de 3 metros — sin perder calidad.

**Cuándo usarlo:**
- Material gráfico (banners, carteles, packaging, remeras)
- Integración con herramientas de diseño (Figma, Illustrator, Canva)
- Impresión de alta calidad sin depender de la resolución

**Atención:**
- No usés SVG para envío por e-mail (la mayoría de los clientes bloquea SVG por seguridad)
- Algunos lectores de QR antiguos pueden tener dificultad con SVG renderizado directamente vía `<img>`

```json
{ "outputFormat": "svg" }
```

Para mostrar SVG inline, el `qrCodeBase64` debe decodificarse primero:
```js
const svgString = atob(qrCodeBase64);
document.getElementById('qr').innerHTML = svgString;
```

---

## Comparativa de Tamaño (ejemplo real — 400px, URL simple)

| Formato | Tamaño típico |
|---|---|
| PNG | ~8–12 KB |
| WebP | ~5–8 KB |
| SVG | ~3–6 KB |

> Los tamaños varían según la complejidad del contenido (los QR con más datos tienen más módulos).

---

## Recomendación por Caso de Uso

| Escenario | Formato recomendado |
|---|---|
| Mostrar en sitio/app | **WebP** |
| Enviar por e-mail | **PNG** |
| Impresión gráfica / diseño | **SVG** |
| Guardar en la nube | **WebP** |
| Máxima compatibilidad | **PNG** |
| Sin preocupación por tamaño | **PNG** |