Conversor de HSL a HEX
Ajusta tono, saturación y luminosidad y obtén el código de color HEX de seis dígitos correspondiente, listo para copiar.
Entrada hsl
Resultado · HEX
#FF3D77
RGB
rgb(255, 61, 119)
HSL
hsl(342, 100%, 62%)
HSV
hsv(342, 76%, 100%)
CMYK
cmyk(0%, 76%, 53%, 0%)
Cómo usarlo: HSL a HEX
- 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.
Por qué convertir HSL a HEX
HSL es la forma más intuitiva de crear un sistema de colores. Fijas un tono, por ejemplo 262° para el violeta, y creas toda una escala cambiando sobre todo la luminosidad: alrededor del 95 % para fondos, del 58 % para botones y acentos, y del 30 % para textos. Diseñadores y desarrolladores usan este método para tintes, sombras y temas oscuros.
Sin embargo, la escala final suele tener que entregarse como códigos HEX: las guías de estilo, los design tokens, las librerías de Figma, los manuales de marca y muchos gestores de contenido esperan valores #RRGGBB. Introduce los valores HSL y copia el resultado HEX; hsl(262, 83%, 58%), por ejemplo, se convierte en #7C3BED. La herramienta también muestra RGB, HSV y CMYK del mismo color. Como HEX solo puede guardar 256 niveles por canal, los cambios muy pequeños en HSL no siempre modifican el código HEX.
Todo se ejecuta localmente en tu navegador: tus imágenes nunca se suben a un servidor.