Conversor HSL
Convierte colores hsl() y hsla() a HEX, RGB y RGBA, o pega un código hex o RGB para obtener su HSL. Todo se ejecuta en tu navegador con vista previa en vivo.
Valor de color
Formatos equivalentes
Introduce un color para ver el resultado.
Qué tienen en común HSL y los códigos hex
HSL describe un color con matiz, saturación y luminosidad. El matiz es un ángulo de 0 a 360 grados y la saturación y la luminosidad son porcentajes, así que es más fácil ajustar un tono que leyendo valores de canal en bruto.
Este conversor también lee los otros formatos. Pega un código hex o un valor rgb() y muestra las cadenas hsl() y hsla() equivalentes, para pasar de una herramienta de diseño a CSS o JavaScript sin adivinar.
Cómo convertir HSL a hex
- Escribe o pega un valor HSL como hsl(217, 91%, 60%) en el campo.
- Pulsa Convertir color.
- Comprueba la vista previa y las filas HEX, HEX8, RGB, RGBA, HSL y HSLA.
- Copia el formato que necesites con el botón que está junto a esa fila.
Ejemplos de conversión HSL
Azul cielo desde HSL
hsl(217, 91%, 60%)
#3C83F6
HSL con transparencia
hsla(217, 91%, 60%, 0.5)
#3C83F680
De hex a HSL
#3B82F6
hsl(217, 91%, 60%)
UrsaKit frente a otros conversores HSL
| Criterio | UrsaKit | htmlcolorcodes.com | rgbtohex.net |
|---|---|---|---|
| Precio | Gratis | Gratis con anuncios | Gratis |
| Lee hsl() y hsla() | Sí | Sí | No |
| Convierte también hex y rgb() | Sí | Sí | Parcial |
| Alfa | Sí, hsla() a hex8 | Sí | Parcial |
| Copiar cada formato | Sí | Parcial | No |
| Sube tu color | No | No | No |
Preguntas frecuentes
¿Qué significa HSL?
Matiz, saturación y luminosidad. El matiz es un ángulo en grados y los otros dos son porcentajes, así que hsl(217, 91%, 60%) es matiz 217, saturación 91% y luminosidad 60%.
¿Puedo pegar un código hex?
Sí. El conversor lee hsl(), hsla(), hex, rgb() y rgba(), así que puedes empezar con el formato que ya tengas.
¿Cómo se maneja el alfa?
hsla() usa un cuarto valor entre 0 y 1. Se escribe en los dos últimos dígitos de un código HEX8, así que hsla(217, 91%, 60%, 0.5) es #3B82F680.
¿Por qué el HSL convertido cambia un poco?
La saturación y la luminosidad se redondean a porcentajes enteros, así que un valor que venía de RGB puede volver con un punto de diferencia. El color no cambia.
¿Se sube mi color a un servidor?
No. El análisis y la conversión se ejecutan en tu navegador con JavaScript y no se envía ningún color.
¿Puedo convertir RGB a hex?
Sí. Usa el conversor de RGB a HEX o el de HEX a RGB enlazados abajo para trabajar directamente con esos formatos.