Convertir RGB a HSL

Introduzca los canales rojo, verde y azul entre 0 y 255. El conversor devuelve el tono en un círculo de 0–360 grados y la saturación y luminosidad como porcentajes de 0 a 100. Rechaza canales ausentes, no numéricos, infinitos o fuera de rango, en vez de corregirlos sin aviso, para que los errores sean visibles y los datos posteriores sigan siendo fiables.

Introduzca correctamente los canales RGB

Proporcione tres campos numéricos para rojo, verde y azul con sus nombres abreviados: r, g y b. Cada canal debe estar entre 0 y 255, incluidos ambos extremos. Cero indica que el canal no aporta intensidad y 255 representa la intensidad máxima. También se admiten decimales intermedios, algo útil cuando otro cálculo genera colores interpolados. El conversor no recorta los valores deliberadamente. Si un canal es negativo, supera 255, falta, no es numérico o es infinito, la solicitud devuelve un error de entrada. Este comportamiento estricto protege los procesos automatizados, porque un dato de origen inválido no puede convertirse silenciosamente en un color verosímil pero incorrecto. Como primera prueba conocida, use r 255, g 0 y b 0; el resultado es rojo con tono de cero grados, saturación completa y luminosidad del cincuenta por ciento. Al copiar valores de CSS, envíe solo los números de los canales, sin la envoltura rgb(), comas ni símbolos de porcentaje. Una entrada numérica evita confundir la escala RGB de 0–255 con la notación porcentual que emplean algunos sistemas de diseño.

Comprenda cómo se calcula el resultado HSL

La conversión comienza normalizando cada canal RGB mediante una división por 255. Después busca el mayor y el menor de los canales normalizados. Su promedio se convierte en la luminosidad y su diferencia, denominada croma, determina si el color tiene saturación y un tono significativo. Cuando el croma es cero, el color es un gris: la saturación vale cero y el tono se devuelve como cero por convención, pues ninguna posición del círculo cromático se distingue visualmente. En colores cromáticos, la saturación es el croma ajustado según la luminosidad actual, mientras que el tono depende del canal RGB mayor. Rojo, verde y azul ocupan sectores distintos del círculo, y las diferencias relativas entre canales fijan la posición dentro del sector. El tono devuelto se expresa en grados desde cero hasta menos de 360. Saturación y luminosidad se multiplican por 100 y se expresan en porcentajes. Los resultados se redondean a cuatro decimales para ofrecer precisión útil y respuestas estables y legibles. Es la transformación RGB a HSL estándar: reorganiza la misma información cromática y no aplica gestión del color, corrección gamma ni conversión de perfiles.

Use HSL en flujos de diseño y aplicaciones

HSL suele ser más comprensible que RGB cuando se crean variaciones. El tono identifica la familia cromática, la saturación controla cuánto se acerca el color al gris y la luminosidad lo desplaza hacia negro o blanco. Tras convertir un color de marca, puede mantener fijo el tono y ajustar la luminosidad para estados de foco, pulsación o desactivación. Una canalización de datos puede normalizar registros de color heterogéneos a una representación HSL común antes de ordenarlos o agruparlos. Un control de calidad también puede comparar los resultados con tokens de diseño y detectar pronto canales RGB defectuosos. Tenga presente que cambios numéricos iguales no siempre producen cambios visuales iguales: HSL resulta cómodo para controles, pero no es un espacio perceptualmente uniforme. Conserve además los valores RGB originales si necesita recorridos de ida y vuelta exactos, porque el redondeo puede introducir una pequeña diferencia al reconvertir. La operación es determinista y solo depende de los números recibidos: no accede a la red, no usa azar ni consulta relojes o bases cromáticas externas. Por ello, entradas idénticas generan salidas idénticas en llamadas repetidas, una propiedad adecuada para pruebas, compilaciones, integraciones API y herramientas reproducibles de sistemas de diseño.