Saltar al contenido

Convierte HSL a Hex online

HSL/HSLA a códigos hex con vista previa. Gratis para diseño y desarrollo.Runs locally in your browser; files never leave your device.Runs locally in your browse

Salida

Vista previa

Hex → HSL

Privado · Rápido · Gratis

Los estilos viven en HSL pero la especificación de diseño es hex — este puente ahorra conversión manual.

hsla transparente se vuelve hex de 8 dígitos cuando el alfa importa; separa la opacidad si el destino no lee hex con alfa.

Cómo convertir

  1. Pega HSL/HSLA
  2. Confirma la muestra
  3. Copia hex

Cuándo ayuda

  • Variables CSS en HSL, el entregable necesita hex.
  • Muestras hex rápidas desde tokens de tema.
  • Pillar errores de canal antes del handoff.

Escenarios

  • HSL arbitrario de Tailwind → hex para un proveedor
  • Tabla de docs estandarizada en hex

Consejos

  • Saturación y luminosidad suelen ser porcentajes.
  • El tono puede incluir `deg` o números planos.
  • La sintaxis inválida muestra un error — corrige a CSS válido.

Ejemplos

Entrada Salida Nota
hsl(9 100% 60%) Cerca de #FF5733 Sintaxis moderna separada por espacios
hsla(..., 0.5) Hex de 8 dígitos Con alfa

Preguntas HSL → Hex

¿Soporta `hsl(a b c / d)`?
Las formas modernas comunes se parsean cuando es posible; vuelve a la sintaxis con comas si hace falta.
¿Ligeramente distinto del cuentagotas?
Redondeo hex — suele ser despreciable en trabajo de UI.

Herramientas relacionadas