Conversor de RGB a HSL
Convierte valores de rojo, verde y azul en tono, saturación y luminosidad para ajustar colores más fácilmente en CSS.
Entrada rgb
Resultado · HSL
hsl(344, 100%, 62%)
HEX
#FF3D72
RGB
rgb(255, 61, 114)
HSV
hsv(344, 76%, 100%)
CMYK
cmyk(0%, 76%, 55%, 0%)
Cómo usarlo: RGB a HSL
- 1
Introduce un color
Escribe un código de color o elige un color con el selector: cada campo acepta el formato que muestra.
- 2
Mira la conversión
El resultado se actualiza al instante mientras escribes, junto con una vista previa en vivo del color.
- 3
Copia el código
Copia el valor que necesitas con un clic y pégalo en tu diseño, tu CSS o tu configuración de impresión.
RGB frente a HSL
RGB construye un color a partir de tres canales de luz, algo ideal para pantallas pero difícil de ajustar a mano: oscurecer un poco rgb(255, 61, 114) obliga a cambiar los tres números. HSL describe el mismo color como tono, un ángulo en la rueda de colores de 0 a 360°, más saturación y luminosidad en porcentaje, de modo que ese rosa pasa a ser hsl(344, 100%, 62%).
Esta estructura hace que HSL sea perfecto para crear variantes y temas. Mantén el tono y la saturación y baja la luminosidad para obtener un estado hover o pulsado, súbela para un fondo teñido o reduce la saturación para una versión apagada. Todos los navegadores modernos aceptan hsl() en CSS, así que puedes pegar el resultado directamente. El conversor redondea los valores a números enteros, por lo que al volver a convertir un canal puede variar en un paso.
Todo se ejecuta localmente en tu navegador: tus imágenes nunca se suben a un servidor.