Generador de códigos QRGuía completa
Todo lo que necesitas para crear códigos QR efectivos con QRStylist.
¿Qué son los códigos QR?
Los códigos QR (Quick Response) son códigos de barras bidimensionales que pueden almacenar distintos tipos de datos. A diferencia de los códigos de barras tradicionales, pueden contener texto, URLs, contactos, datos de WiFi y mucho más. La tecnología está normalizada en la ISO/IEC 18004:2024.
Creados en 1994 por Denso Wave para el sector del automóvil, los códigos QR se usan hoy en marketing, pagos e intercambio de información. Los smartphones actuales los leen con la cámara, sin apps adicionales.
Incluyen corrección de errores, así que se pueden leer aunque estén algo dañados u ocultos. Por eso son fiables en impresos, packaging y señalización.
Tipos de códigos QR
QRStylist ofrece 16 tipos de código QR, cada uno pensado para un uso concreto. Haz clic en uno para ir al generador y a su documentación.
Enlaza a cualquier web o página
Conecta dispositivos a redes WiFi
Guarda contactos en la libreta
Enlace al perfil de Instagram
Enlace a página de Facebook
Enlace al perfil de LinkedIn
Enlace al perfil de TikTok
Enlace al canal de YouTube
Enlace al perfil de X
Códigos QR para pago con cripto
Abre el correo con la dirección rellenada
Inicia una llamada
Abre el mensaje con el texto listo
Añade eventos a la agenda
Abre la ubicación en mapas
Muestra un mensaje de texto
Opciones de personalización
Cada código QR se puede personalizar. El panel de diseño tiene tres pestañas: Formas, Colores y Logo. Esto es lo que ofrece cada una:
Pestaña Formas
Controla el aspecto de los módulos del código y de los tres patrones de las esquinas.
- Patrón de datos: estilo de los módulos (cuadrado, puntos, rombos, redondeado, extra redondeado, fluido, etc.).
- Forma de esquina: forma de los tres patrones de posición (los "ojos"): cuadrado, redondeado o círculo.
- Esquina interior: forma del centro de cada ojo (cuadrado o círculo).
- Zona tranquila (margen): espacio blanco alrededor del código. Se recomienda al menos 4 módulos para un escaneo fiable (ISO/IEC 18004).
Pestaña Colores
Define el color del código y del fondo. Modos disponibles:
- Sólido: color del código y del fondo. Un solo color para máxima claridad.
- Degradado: inicio, fin y color de fondo para un código en dos tonos.
- Clásico: negro y blanco para máximo contraste y compatibilidad.
Mantén un contraste suficiente entre primer plano y fondo para que se escanee bien.
Pestaña Logo
Añade un logo o icono en el centro. El código usa alta corrección de errores para seguir escaneándose con el logo.
- Subir logo: haz clic, arrastra o pega una imagen. Lo ideal es una imagen cuadrada con fondo transparente.
- Icono social: elige un icono integrado (Facebook, YouTube, X, Instagram, LinkedIn o TikTok).
- Tamaño del logo: control para elegir qué parte del código ocupa el logo (en %).
- Margen del logo: espacio en píxeles entre el logo y los módulos.
¿Por qué parece que el código crece en la vista previa al añadir más texto?
Más texto implica más módulos (cuadrados) para almacenar los datos. El borde blanco (zona tranquila) se mantiene en un tamaño fijo en módulos (al menos 4 por lado). El tamaño total de la imagen no cambia; al añadir contenido, más espacio lo ocupa el patrón y menos el borde. El borde sigue siendo de 4 módulos; cada módulo se hace un poco más pequeño, por eso parece que crece. Es normal y el código descargado se escaneará bien.
Buenas prácticas
Recomendado
- Prueba el código antes de imprimir o publicar
- Mantén un contraste alto entre código y fondo (objetivo 4,5:1 según WCAG)
- Deja zona tranquila (margen) de al menos 4 módulos
- Tamaño adecuado a la distancia de lectura (mín. 2 cm para uso cercano)
- Incluye una llamada a la acción cerca del código
- Usa URLs con HTTPS por seguridad y confianza
Evitar
- Usar colores de bajo contraste (p. ej. gris claro sobre blanco)
- Invertir colores (fondo oscuro, código claro)
- Imprimir muy pequeño o deformar el código
- Colocar sobre superficies muy texturizadas o reflectantes
- Enlazar a contenido que no sea apto para móvil
- Usar un logo que cubra más del 30% del código
Prueba el código antes de usarlo
Cada código generado debe probarse. Después de descargar, escanéalo con la cámara del móvil (o con otro dispositivo que use tu audiencia) y comprueba que el resultado es correcto.
- URL / enlaces: confirma que se abre la página correcta.
- WiFi: escanea desde otro dispositivo y comprueba que se une a la red correcta.
- vCard / contacto: revisa que el contacto guardado tenga nombre, número y datos correctos.
- Otros tipos: ejecuta la acción (SMS, email, evento, etc.) y verifica que el contenido sea el esperado.
Si vas a imprimir el código, prueba a un tamaño similar (por ejemplo en pantalla a tamaño de impresión) para detectar problemas de lectura antes de mandar a imprimir.
Escaneo y compatibilidad
Los códigos generados con QRStylist son compatibles con dispositivos y apps de escaneo actuales.
iPhone (iOS)
Abre la app Cámara y apunta al código. Aparece un aviso: tócalo para abrir. En iOS 11 y posteriores. Para WiFi, aparece "Unirse a la red" automáticamente.
Android
La mayoría de móviles Android (9 en adelante) escanean desde la app Cámara. En algunos hay que activarlo en ajustes. Google Lens también suele estar integrado.
Apps de terceros
Cualquier app de escáner QR puede leer los códigos. Usamos formatos estándar (URL, WIFI:, MECARD:, VEVENT, etc.) reconocidos universalmente.
Normas y recursos
Los códigos QR y los formatos que codifican se basan en estándares abiertos. Referencias útiles:
Norma de códigos QR
Norma internacional del símbolo QR, incluyendo corrección de errores y codificación.
ISO/IEC 18004:2024Orígenes del código QR
Historia y desarrollo por Denso Wave, inventores del código QR.
QRCode.com (Denso Wave)Especificación vCard
Estándar IETF para tarjetas de visita electrónicas (códigos vCard).
RFC 6350 (IETF)Formato iCalendar
Estándar para datos de eventos (formato VEVENT) en códigos QR de evento.
RFC 5545 (IETF)Directrices de accesibilidad
WCAG sobre contraste de color, útil para códigos QR escaneables.
WCAG 2.1 Contraste (W3C)Comprobador de contraste
Comprueba que los colores de tu código cumplan requisitos de contraste.
WebAIM Contrast Checker