Convertidor CMYK a HSL

Convierte valores CMYK (Cian, Magenta, Amarillo, Negro) a HSL (Tono, Saturación, Luminosidad) para uso en CSS y desarrollo web.

Valores CMYK

C
%
M
%
Y
%
K
%
CMYK(80%, 30%, 0%, 10%) Ctrl+C
HSL(210°, 100%, 43%)
H: 210°S: 100%L: 43%
CSS: hsl(210, 100%, 43%)

Variantes de luminosidad

Cómo Usar el Convertidor

1Ingresa CMYK — Ajusta C, M, Y, K con los deslizantes (0-100% cada uno).
2Obtén HSL — Los valores y la función CSS se actualizan en tiempo real.
3Copia para CSS — Usa el botón para copiar la función hsl() directamente en tu stylesheet.

¿Cómo Funciona?

La conversión requiere dos pasos:

PasoProcesoEjemplo
1. CMYK → RGBR = 255 × (1-C) × (1-K)R=46, G=161, B=230
2. RGB → HSLAlgoritmo de conversiónHSL(210°, 100%, 43%)

¿Por Qué Convertir CMYK a HSL?

Imprenta → Web

Tu marca tiene colores definidos en CMYK para folletos. Ahora necesitas esos mismos colores en CSS para el sitio web, idealmente en HSL para generar variantes.

Design Tokens

Define colores de marca como tokens HSL para generar escalas completas. Desde un CMYK corporativo, obtén el HSL base y crea toda tu paleta programáticamente.

Apps Móviles

Los frameworks como Flutter y React Native aceptan HSL. Si tu equipo de marketing trabaja en CMYK, necesitas HSL para el equipo de desarrollo móvil.

Modo Oscuro

HSL es ideal para dark mode: mantén H y S, ajusta L. Convierte tu color CMYK a HSL para crear automáticamente la versión dark de tu marca.

Preguntas Frecuentes

¿La conversión CMYK a HSL es exacta?
Tiene una doble aproximación: CMYK→RGB (depende del perfil ICC) y luego RGB→HSL (exacta). Los valores CMYK son relativos al dispositivo de impresión, por lo que la conversión genérica es una estimación razonable.
¿Para qué necesito HSL si tengo un color CMYK?
HSL es nativo de CSS y permite manipulación programática fácil. Si reimplementas un color de impresión en web, HSL te permite generar variantes (hover, dark mode, etc.) de forma intuitiva.
¿Puedo usar el resultado HSL directamente en CSS?
Sí: color: hsl(210, 80%, 45%);. Los navegadores modernos soportan hsl() desde hace años. CSS Level 4 también acepta la sintaxis sin comas.
¿La Saturación HSL equivale a la intensidad del color CMYK?
Conceptualmente sí, pero se calculan diferente. La saturación CMYK se determina por la mezcla de tintas; la S de HSL es una proporción matemática de la luminosidad. No son directamente comparables.
¿Qué pasa si mis valores CMYK suman más de 300%?
La conversión sigue funcionando, pero un TIC >300% puede causar problemas en impresión real. Para CSS, el resultado HSL será válido independientemente del TIC de los valores CMYK originales.