Convertir RGB a HSL

Qué es convertir RGB a HSL

RGB describe un color por la cantidad de rojo, verde y azul que lo componen, normalmente como tres números de 0 a 255: el formato que devuelve casi cualquier selector de color, cualquier captura de pantalla analizada con una herramienta, o una lectura de píxel de un lienzo (canvas). HSL describe el mismo color de otra forma, más cercana a como lo describiría una persona: el tono (de qué color se trata, en una escala circular de 0 a 360 grados), la saturación (cuán intenso o apagado es) y la luminosidad (cuán claro u oscuro). Convertir RGB a HSL no cambia el color: reordena la misma información en las tres cualidades con las que se suele hablar de un color en voz alta.

Esta herramienta acepta rgb(64, 147, 230) completo o solo los tres números separados por comas en el campo de texto, y también permite escribir el rojo, el verde y el azul por separado en sus propios campos; el tono, la saturación y la luminosidad se recalculan al instante, sin necesidad de enviar nada.

Es la dirección que se usa cuando el dato de partida son canales —los tres números que copiaste de un selector, leíste de una imagen o extrajiste con código— y lo que necesitas es una forma de hablar de ese color que tenga sentido para una persona: más claro, más saturado, de tal tono.

Cómo convertir RGB a HSL

1. Introduce los valores RGB. Escribe algo como rgb(64, 147, 230) o solo los números en el campo de texto, o completa el rojo, el verde y el azul por separado en los tres campos numéricos; el HSL se recalcula al instante, sin necesidad de enviar nada.
2. Lee el HSL y el color resultante. El muestrario grande muestra el color y, junto a él, su valor hsl(); haz clic en cualquiera de los dos para copiarlo.
3. Consulta los otros formatos. La fila inferior muestra el mismo color en hex y en RGB listos para copiar, además de un enlace al color con nombre más cercano y al selector de color completo.

Para qué sirve esta conversión

Convertir RGB a HSL sirve para pasar de un dato que se genera mecánicamente —los tres canales que entrega un selector de color, un análisis de imagen o una lectura de píxel de un canvas— a una descripción que se puede razonar y comunicar: «un verde bastante saturado y de luminosidad media» dice mucho más que «34, 177, 76».

También ayuda a comparar colores entre sí de un vistazo: dos colores con RGB muy distintos pueden resultar tener el mismo tono y diferir solo en la luminosidad, algo que salta a la vista en HSL y que es casi imposible de notar mirando tres números de 0 a 255 por separado.

Y sirve como paso intermedio antes de ajustar el color: una vez lo tienes en HSL, es más fácil decidir cuánto subir la luminosidad o girar el tono para conseguir la variante que buscas, y luego usar la fila de otros formatos para obtener el hex final.

Qué tan exacta es esta conversión

Pasar de RGB a hex, en cualquier dirección, no pierde nada: son los mismos tres bytes escritos en base 10 o en base 16, así que esa parte es exacta siempre, para cualquier combinación de rojo, verde y azul.

El límite aparece al pasar a HSL y mostrarlo redondeado a grados y porcentajes enteros, que es como lo presenta esta y cualquier otra herramienta. Convertir los 16.777.216 colores sRGB a ese HSL redondeado y de vuelta a RGB solo devuelve el color original en el 10,58% de los casos (1.775.570 colores); el 89,42% restante (15.001.646) vuelve como un color ligeramente distinto. La razón es de conteo, no de implementación: el HSL entero solo tiene 3.672.360 combinaciones posibles —360 tonos, 101 saturaciones, 101 luminosidades— para 16.777.216 colores, así que al menos un 78,11% tiene que compartir etiqueta; lo medido, 89,42%, está por encima de ese mínimo. El desvío suele ser de un punto en el canal más afectado (54,38% de los colores) o de dos (32,06%); el peor caso medido fue #02E4E6, mostrado como hsl(181, 98%, 45%) y reconvertido a #02DFE3.

A plena precisión, en cambio, la transformación no pierde nada: convertidos los 16.777.216 colores a HSL y de vuelta sin redondear, todos regresan exactamente al color de partida. La fórmula se verificó además de forma independiente frente al módulo colorsys de la biblioteca estándar de Python: sobre más de 60.000 colores, incluyendo todos los grises y un barrido de tonos puros, ambas implementaciones coincidieron en el tono, la saturación y la luminosidad sin ninguna discrepancia.

Un caso particular: cuando el rojo, el verde y el azul son iguales —un gris exacto, algo frecuente al leer valores de un selector de color, una captura de pantalla o un canvas—, el tono no tiene ninguna dirección definida en la rueda de color; esta herramienta, siguiendo la convención habitual, lo muestra como 0.

Por qué es gratis

Igual que el resto de conversiones de color del sitio, esta se calcula enteramente en tu navegador; los valores RGB que escribes no viajan a ningún servidor ni se guardan en ningún sitio. Sin ese coste de servidor, no hace falta pedir una cuenta, cobrar, poner límites de uso ni añadir marca de agua a un simple número.