Generador de códigos QR
Personalizar
Cómo funciona
Escribe o pega en el campo lo que quieres codificar: un texto, un enlace, una dirección de correo (`mailto:`), un número de teléfono (`tel:`), los datos de una red Wi-Fi, una vCard o un evento de calendario. El código QR se actualiza mientras escribes. El panel Personalizar ya está abierto y te deja decidir el aspecto:
• Color del código y color de fondo: selector de color más campo hexadecimal. Puedes usar los colores de tu marca en lugar del negro sobre blanco, o combinar el color del código con un fondo transparente para colocarlo sobre cualquier diseño. • Fondo transparente: con la casilla marcada, el PNG y el SVG se exportan con canal alfa, así que el código se funde con fotos, degradados o papel de color. La vista previa muestra un tablero de ajedrez para que veas dónde el fondo es transparente. • Tamaño: un control deslizante de 128 a 1024 px para la imagen generada. El PNG exportado tiene exactamente esa resolución; el SVG es vectorial y se amplía sin perder calidad. • Margen (zona de silencio): el borde blanco alrededor del código. La especificación QR exige al menos 4 módulos de zona de silencio para leerlo con fiabilidad, y algunas impresiones piden más. • Nivel de corrección de errores: L (~7%), M (~15%, el predeterminado), Q (~25%), H (~30%). Los niveles altos hacen el código más denso, pero aguanta más daño o más superficie tapada antes de dejar de leerse. • Logo en el centro: sube cualquier imagen (PNG, JPG, SVG, WebP) y aparece centrada en el QR. Ajusta el tamaño del logo entre el 10% y el 30% del área del QR. Un rectángulo de relleno detrás del logo, opcional, mantiene el contraste frente a los módulos del código. Al añadir un logo, la corrección de errores se fija en H para que la parte tapada siga siendo recuperable.
Dos formatos de exportación: • PNG: imagen de píxeles al tamaño elegido. Haz clic derecho y guarda, arrástrala a Slack o al correo, o insértala en una presentación. • SVG: vectorial, nítido a cualquier tamaño, que es lo que necesitan la imprenta, los pósters y las tarjetas de visita. El logo, si lo hay, va dentro del SVG como una URL de datos en base64, así que el archivo es autónomo.
Un código QR codifica los datos como una matriz de módulos blancos y negros. La versión más pequeña guarda unos 25 caracteres alfanuméricos; la mayor (versión 40) unos 4300. La herramienta elige sola la versión más pequeña que cabe en tu texto, así que las entradas cortas dan códigos más pequeños y fáciles de leer. Si una URL pasa de unos 200 caracteres, plantéate un acortador (bit.ly, short.io, un dominio tuyo) antes de codificarla.
Usos típicos: un QR de marca en una tarjeta de visita con tu logo y tu color; un QR de carta impreso en el atril de una mesa de restaurante, en oscuro sobre crema; un código para entrar al Wi-Fi plastificado junto al router; un QR de vCard para la acreditación de un congreso; un QR de evento de calendario para el enlace de "Añadir al calendario" de un correo; un QR transparente sobre la imagen principal de un póster.
Todo se ejecuta en tu navegador: el texto que escribes, el logo que subes, los colores y las imágenes generadas nunca salen de tu equipo. Abre las herramientas para desarrolladores, ve a la pestaña Red y comprueba que no sale ninguna petición mientras personalizas y descargas.
Preguntas frecuentes
¿Puedo poner un logo o una imagen en el centro del código QR?
- Sí. Abre Personalizar → Logo en el centro y elige una imagen (PNG, JPG, SVG, WebP); el logo aparece centrado en el QR. Un control deslizante decide cuánta área del QR cubre (del 10% al 30%) y una casilla activa un fondo detrás para mejorar el contraste. Al subir un logo, la corrección de errores se fija en H (≈30% de recuperación) para que el QR se lea aunque el centro esté tapado.
¿Puedo cambiar la forma y el borde del fondo del logo?
- Sí. Tras subir un logo puedes elegir la forma del fondo (Cuadrado, Cuadrado redondeado o Círculo), el margen (0–50% del tamaño del logo), su color y, si quieres, un borde de color con grosor ajustable (1–10% del lado del fondo). La propia imagen del logo se recorta con la misma forma que el fondo, así que un fondo circular también da un logo circular, al estilo iOS. Todos los ajustes pasan a la exportación SVG mediante <rect>/<circle> más <clipPath> insertados, así que el archivo descargado es autónomo y editable en Figma o Illustrator.
¿Puedo cambiar los colores del código QR?
- Sí. El panel Personalizar tiene selectores de color para el primer plano (los módulos oscuros, por defecto #212529) y para el fondo (los módulos claros, por defecto blanco). Usa los colores de tu marca, oscuro sobre claro o claro sobre oscuro. Mantén un contraste alto (~4,5:1 como mínimo) para que las cámaras de los teléfonos sigan detectando el código con fiabilidad.
¿Puedo hacer que el fondo del código QR sea transparente?
- Sí. Marca "Fondo transparente" bajo el selector de color de fondo. El PNG y el SVG se exportan entonces con canal alfa completo, así que puedes colocar el código sobre cualquier imagen, degradado o papel de color sin que se vea un cuadrado blanco alrededor. La vista previa muestra un tablero de ajedrez para que veas la transparencia.
¿Qué puedo codificar en un código QR?
- Cualquier contenido de texto: texto sin formato, una URL, una dirección de correo (mailto:), un número de teléfono (tel:), un SMS (smsto:), una ubicación geográfica (geo:), un evento de calendario (BEGIN:VEVENT...) o una tarjeta de contacto (BEGIN:VCARD...). La especificación QR no limita el contenido, y es el lector quien interpreta el prefijo.
¿Cuántos datos caben en un código QR?
- En la versión máxima (40) con la corrección de errores más baja (L), hasta ~7089 dígitos, ~4296 caracteres alfanuméricos o ~2953 bytes. En la práctica, mantén las URL por debajo de ~200 caracteres: así el código sigue siendo lo bastante pequeño para que la cámara de un teléfono lo detecte desde una distancia cómoda.
¿Qué nivel de corrección de errores debo elegir?
- L o M para códigos en pantalla, donde nada daña la imagen; Q o H para códigos impresos que viven en el mundo real (cartas, pegatinas, pósters), porque una parte de esa superficie acabará rayada, sucia o tapada. Al superponer un logo se fuerza H automáticamente, ya que el logo tapa algunos módulos y el resto tiene que compensarlo. Más corrección significa un código más denso, así que no te pases.
¿Qué es la zona de silencio (margen) y de qué tamaño debe ser?
- La zona de silencio es el borde blanco alrededor del código, y la especificación QR exige un mínimo de 4 módulos. Los lectores la usan para detectar dónde empieza y acaba el código. La herramienta usa 4 por defecto y te deja subirla hasta 10 para impresiones en las que el diseño de alrededor podría confundirse con módulos del código. No la pongas a 0, porque la mayoría de los lectores no lo detectarán.
¿Puedo descargar un SVG con el logo incluido?
- Sí. La exportación SVG incluye el logo como un elemento `<image>` con una URL de datos en base64, así que el archivo .svg resultante es autónomo y se puede editar en Figma, Illustrator o Inkscape. El rectángulo de relleno, si está activado, se añade como un `<rect>` insertado para que quede en el orden correcto detrás de la imagen.
¿Por qué no se lee mi código QR?
- Cuatro sospechosos habituales: (1) está impreso demasiado pequeño para la distancia de lectura, así que apunta a al menos 2,5 cm a la distancia de un brazo y más grande en una pared; (2) el contraste de color es demasiado bajo, así que mantén al menos 4,5:1 entre primer plano y fondo; (3) el logo es demasiado grande o el nivel de corrección demasiado bajo para cubrirlo, así que no pases del 25% de tamaño de logo con corrección H; (4) la zona de silencio (margen) es 0 o 1, y los lectores necesitan al menos 4 módulos de espacio en blanco alrededor del código.
¿Puedo codificar una contraseña o datos sensibles?
- Puedes, pero cualquiera que fotografíe el código tiene tu contraseña. Los códigos QR están pensados para compartir, no para guardar secretos, así que trata el código igual que el texto sin formato: seguro para publicarlo, inseguro para datos privados. El generador de códigos QR para Wi-Fi es el ejemplo cotidiano: funciona, y la contraseña es visible para cualquiera que escanee o fotografíe el resultado.
¿Están seguros mis datos y mi logo?
- Sí. La imagen del QR y el logo se procesan por completo en tu navegador con una librería en el cliente: sin servidor, sin subidas y sin registros. El archivo del logo se lee en memoria con FileReader y nunca se transmite. Puedes comprobarlo abriendo las herramientas para desarrolladores y mirando la pestaña Red: al personalizar, generar o descargar no sale ninguna petición.
Niveles de corrección de errores del QR: qué cabe y qué sobrevive
Los códigos QR incluyen datos redundantes de corrección de errores para que una parte del código pueda dañarse o taparse y el lector siga recuperando el contenido. Elegir el nivel adecuado es un equilibrio entre densidad del código y resistencia.
| Nivel | Recuperación | Cobertura de logo admisible | Uso típico | Compromiso |
|---|---|---|---|---|
| L | ≈ 7% | Hasta ~5% (no se recomienda logo) | Códigos en pantalla que se muestran poco tiempo (presentaciones, superposiciones de vídeo) | El código más pequeño y denso: más datos por byte. Frágil al imprimir |
| M | ≈ 15% | Hasta ~10% (solo un logo pequeño) | Predeterminado. Banners web, correos, cualquier sitio donde el código esté limpio | Equilibrado. Aproximadamente un 10% más de módulos que L |
| Q | ≈ 25% | Hasta ~20% | Material de marketing impreso, pegatinas, embalajes | Más módulos por carácter, así que el código es más denso pero tolera el desgaste |
| H | ≈ 30% | Hasta ~25% (logo completo superpuesto) | QR de marca con logo en el centro, carteles exteriores, atriles de mesa | El más denso. La herramienta fuerza este nivel al subir un logo |
Los porcentajes de recuperación proceden de la especificación QR ISO/IEC 18004. La cobertura de logo es orientativa y empírica: lo que se puede tapar sin riesgo depende de qué módulos oculte el logo (el centro es más seguro que las cercanías de los tres patrones de esquina).