CMYK vs. RGB vs. HEX en flujos de trabajo reales
La forma más sencilla de separarlos es por entorno de salida:
- RGB es para pantallas: sitios web, apps, diseño de UI, vídeos, publicaciones en redes sociales, anuncios digitales
- CMYK es para impresión: folletos, envases, revistas, tarjetas de visita, etiquetas
- HEX es para web y código: CSS, design tokens, guías de estilo, plantillas de correo electrónico
Por qué los modelos no son intercambiables
RGB es un modelo aditivo. Crea color añadiendo luz roja, verde y azul. Cuanta más luz se añade, más cerca se llega al blanco.
CMYK es un modelo sustractivo. Crea color superponiendo tintas cian, magenta, amarilla y negra. Cuanta más tinta se añade, más oscuro es el resultado.
HEX no es un modelo de ciencia del color separado en el mismo sentido que CMYK. Es una notación textual compacta para valores de color digital, normalmente asignada a canales RGB.
Comparación de RGB, valores de impresión y notación web
|
Modelo |
Construido a partir de |
Entorno principal |
Formato típico |
Limitación principal |
|
RGB |
Luz |
Pantallas |
rgb(255, 87, 51) |
No es fiable para predición de impresión |
|
CMYK |
Porcentajes de tinta |
Impresión |
0, 66, 80, 0 |
Gama más pequeña que muchas pantallas |
|
HEX |
Valor digital codificado |
Código web/UI |
#FF5733 |
No usado directamente por dispositivos de impresión |
Qué almacena realmente cada formato
RGB
RGB almacena la intensidad de los canales rojo, verde y azul. Cada canal generalmente va de cero al valor máximo de visualización. Es ideal cuando la imagen final se emite como luz.
CMYK
CMYK almacena el porcentaje de cuatro tintas. Está destinado a la salida física, donde el papel, el recubrimiento, el perfil de la impresora y las condiciones de prensa afectan al aspecto.
HEX
HEX almacena valores de canal digital en forma hexadecimal. Por ejemplo:
- #FF0000 = rojo
- #00FF00 = verde
- #0000FF = azul
- #FFFFFF = blanco
- #000000 = negro
¿El código HEX es el mismo para RGB y CMYK?
No. Un código HEX puede corresponder estrechamente a un valor RGB porque ambos se usan en la representación de color digital, pero no equivale directamente a una receta CMYK. El mismo rojo visual puede tener una notación HEX, un triplete RGB y varias posibles construcciones de impresión CMYK dependiendo del perfil de color y las condiciones de impresión.
Por qué un color de pantalla puede producir varios resultados de impresión
Un diseñador puede elegir #E63946 para un banner web y luego pedir al equipo de impresión el «mismo» color. Ahí es donde comienzan los problemas. Un operador de prensa puede convertirlo en una combinación CMYK para papel estucado y otra diferente para papel sin estucar. Ambas son válidas, porque la impresión depende del perfil.
Por eso la documentación de marca no debe detenerse en los valores web. Debe especificar:
- RGB para uso en interfaces y pantallas
- HEX para desarrolladores
- CMYK para producción en impresión
- a veces referencias Pantone o colores planos para colores de marca críticos
Códigos RGB HEX CMYK y cómo leerlos
Estas notaciones describen el color de forma diferente, por lo que leerlas correctamente ahorra tiempo durante la entrega.
Conjunto de ejemplo
Tomemos un color rojo-anaranjado brillante:
- HEX: #FF6B35
- RGB: 255, 107, 53
- CMYK: una aproximación basada en perfil como 0, 58, 79, 0
Están relacionados, pero no son idénticos en comportamiento. En la pantalla de un teléfono el color puede parecer vivo y luminoso. En impresión puede parecer más cálido, apagado o más profundo, especialmente en papel mate.
Valor HEX vs. RGB y CMYK
La diferencia clave no es solo la sintaxis. Es el propósito.
- Un valor HEX es conveniente para código y sistemas de estilo digital.
- RGB es mejor cuando se trabaja en software que controla el color de pantalla basado en canales.
- CMYK es necesario cuando la salida es física y limitada por la tinta.
Un diseñador web puede trabajar con seguridad en HEX y RGB. Un diseñador de envases no puede ignorar CMYK sin arriesgarse a una deriva de color en producción.
Conversión de HEX a RGB y CMYK: lo que realmente ocurre
Muchos principiantes asumen que la conversión es una transferencia neutra. No lo es. La conversión es interpretación a través de un perfil de color.
Ruta de conversión típica
- HEX se interpreta primero como un color RGB
- ese valor RGB se mapea a un espacio de color de trabajo
- el perfil de impresión de destino lo convierte en porcentajes CMYK
- el resultado visible depende de la capacidad del dispositivo
Error común
Un equipo diseña un folleto en colores web y luego exporta directamente para impresión sin comprobar las advertencias de gama. Los azules brillantes, verdes y acentos de neón a menudo pierden intensidad porque algunos colores de pantalla simplemente no se pueden reproducir con la impresión estándar de cuatro colores.
HEX CMYK RGB en sistemas de marca
Una guía de marca sólida trata estos valores como referencias coordinadas, no como sustitutos.
Qué debe contener una entrada de color de marca utilizable
|
Campo de color de marca |
Ejemplo |
Por qué importa |
|
HEX |
#1D4ED8 |
Implementación rápida en código |
|
RGB |
29, 78, 216 |
Flujos de trabajo de renderizado en pantalla consistentes |
|
CMYK |
porcentajes específicos del perfil |
Salida de impresión controlada |
|
Nota de uso |
Botón principal / encabezados / acentos de envase |
Previene el uso incorrecto |
Ejemplo práctico
Una empresa SaaS usa un azul eléctrico intenso en su app. En Figma y CSS, el equipo trabaja con HEX y RGB. Cuando preparan materiales para ferias comerciales, el proveedor de impresión solicita CMYK o un equivalente de color plano. Si el equipo envía solo valores digitales, el impresor debe adivinar la conversión y la consistencia de marca se debilita inmediatamente.
Cómo elegir el modelo correcto sin adivinar
Usar RGB cuando
- el activo final se verá en una pantalla
- se diseña UI, iconos, dashboards, páginas de aterrizaje o gráficos de vídeo
- el brillo del color y el resplandor importan
Usar CMYK cuando
- el archivo va a impresión
- se preparan folletos, catálogos, pósteres, envases o etiquetas
- la aprobación depende de la salida física
Usar HEX cuando
- el color se implementará en CSS, HTML o design tokens
- los desarrolladores necesitan un valor de código compacto
- el sistema de diseño está documentado para productos digitales
Conclusión
La confusión en torno a los modelos de color generalmente proviene de una suposición falsa: que un valor debería funcionar en todas partes. No es así. RGB define el color de pantalla a través de la luz. CMYK define el color impreso a través de la tinta. HEX es la abreviatura que usan los desarrolladores para especificar valores de color digital de manera eficiente.
Trátalos como herramientas conectadas pero separadas. Construir activos digitales en RGB o HEX, preparar activos de impresión en CMYK y nunca esperar una coincidencia visual uno a uno directa sin conversión consciente del perfil. Ese enfoque previene tiradas de impresión fallidas, marca inconsistente y ciclos de revisión interminables.