Los tres describen el mismo color subyacente
En colores CSS comunes, HEX y RGB son dos notaciones para canales sRGB. HSL usa otras coordenadas sobre ese espacio. La conversión es matemática, pero porcentajes HSL redondeados quizá no reproduzcan exactamente el triplete RGB original; los colores fuera de sRGB necesitan más contexto.
Qué significan realmente los dígitos del HEX
Un código HEX de 6 dígitos como #2563eb son tres números hexadecimales (base 16) de 2 dígitos, uno tras otro: 25 para el rojo, 63 para el verde, eb para el azul. Cada par va de 00 (ninguna intensidad) a ff (intensidad total, 255 en decimal); 25 en hexadecimal equivale a 37 en decimal, 63 equivale a 99, y eb equivale a 235, que es exactamente el valor RGB del mismo color. Un cuarto par opcional (un código HEX de 8 dígitos) añade un canal alfa para la transparencia, usando la misma escala de 00 a ff.
Por qué HSL suele ser más fácil de editar a mano
Supongamos que quieres una versión más clara de un azul. En RGB, "más claro" significa aumentar los tres canales juntos manteniendo su proporción más o menos constante; algo que no puedes hacer a ojo sin recalcular tres números. En HSL, la luminosidad es su propio eje independiente: mantén el matiz y la saturación exactamente iguales y simplemente sube el porcentaje de luminosidad, y obtienes una versión más clara del mismo color exacto, sin riesgo de desviar accidentalmente el matiz. Por eso HSL aparece a menudo en herramientas de diseño y en sistemas de propiedades personalizadas de CSS construidos para generar tonos y matices de forma programática a partir de un color base.
Qué controla realmente el canal alfa
El alfa controla la transparencia, no el brillo; un color al 50% de alfa no es una versión más oscura del color, es el mismo color mostrado a la mitad de opacidad, dejando ver lo que hay detrás. Por eso un blanco semitransparente puede seguir viéndose "claro" incluso con un valor de alfa bajo sobre un fondo oscuro, mientras que ese mismo color con ese mismo alfa se ve distinto sobre un fondo claro; el valor de alfa por sí solo no determina el resultado final en pantalla, lo que hay detrás también influye.
Detalles de conversión
¿El HEX de 3 dígitos (como #fff) es realmente igual que el de 6? Sí; cada dígito simplemente se duplica: #fff se expande a #ffffff, #2a5 se expande a #22aa55. Es una abreviatura, no un espacio de color distinto.
Dentro de la notación sRGB estándar, RGB y HSL cubren la misma gama. La cantidad de valores almacenables depende de la precisión; HSL no está limitado intrínsecamente a 24 bits.
Los valores HSL enteros pierden precisión. Al volver, un canal RGB puede variar una o más unidades según el redondeo y la implementación.
Elige y convierte un color
El Selector y Conversor de Color de Orisod convierte entre HEX, RGB y HSL con alfa en tu navegador. Puede haber pequeñas diferencias al redondear y reconvertir.
Elegir y convertir un color →HEX, RGB y HSL son tres ventanas hacia el mismo color, no tres estándares en competencia; cuál usar depende de qué eje necesitas controlar (bytes exactos, o matiz/luminosidad intuitivos), no de cuál es más "correcto".