Añade la entrada
Un valor HEX, RGB(A) o HSL(A).
Mesa de diseño
Conversor de colores
Mantén los formatos sincronizados mientras revisas un color.
Privacidad integradaTu trabajo permanece contigo
Valores convertidos
La transparencia alfa se conserva cuando está presente.
HEX
#14B8A6RGB
rgb(20, 184, 166)HSL
hsl(173, 80.4%, 40.0%)Propiedad personalizada CSS
--color-brand: #14B8A6;Tu trabajo permanece privado en el navegador mientras usas esta herramienta.
¿Qué hace conversor de colores?
Convierte un color CSS entre notación hexadecimal, RGB(A) y HSL(A), conservando el canal alfa cuando existe. También genera una propiedad personalizada CSS lista para pegar.
- Entrada
- Un valor HEX, RGB(A) o HSL(A).
- Resultado
- Valores de color y una propiedad CSS listos para copiar.
- Precio
- Gratis
- Cuenta
- No necesaria
Cómo usar conversor de colores
Elige los ajustes
Mantén los formatos sincronizados mientras revisas un color.
Guarda o copia
Valores de color y una propiedad CSS listos para copiar.
Consejo práctico
Conserva el canal alfa cuando necesites mantener la transparencia.
Cuándo usar conversor de colores
Pasar un valor HEX de un diseño a RGB o HSL para una hoja de estilos existente.
Examinar el tono, la saturación y la luminosidad de un color RGB antes de ajustarlo.
Normalizar un HEX abreviado o con alfa antes de guardarlo como token de diseño.
Ejemplo
Un ejemplo concreto de conversor de colores
- Entrada
- rgba(20, 184, 166, 0.5)
- Resultado
- El conversor devuelve #14B8A680, rgba(20, 184, 166, 0.50) y hsla(173, 80.4%, 40.0%, 0.50), además de --color-brand: #14B8A680;.
Qué puedes esperar
Cómo funciona
El analizador admite HEX de 3, 4, 6 u 8 dígitos y valores numéricos rgb()/rgba() y hsl()/hsla(). Convierte el color mediante cálculos de canales sRGB, expande HEX abreviados, redondea los canales RGB mostrados y obtiene HSL a partir del máximo, el mínimo y la luminosidad.
Antes de usarla
Límites y casos especiales
- No interpreta nombres de color, lab(), lch(), oklab(), oklch(), color() ni canales RGB porcentuales.
- Los valores se redondean para mostrarlos; copiar repetidamente un valor redondeado entre formatos puede introducir pequeñas diferencias.
Normas y fuentes
Preguntas frecuentes
Preguntas sobre Conversor de colores
¿conversor de colores es gratis?
Sí. Conversor de colores se puede usar gratis.
¿conversor de colores mantiene privado mi trabajo?
Sí. Tu trabajo permanece privado mientras usas la herramienta; no se sube lo que introduces.
¿El conversor conserva la transparencia?
Sí. Los valores HEX de 4 u 8 dígitos, rgba() y hsla() conservan el alfa en los formatos generados. Los colores totalmente opacos se muestran sin componente alfa.
¿Por qué no se acepta un nombre CSS como rebeccapurple?
Esta implementación reconoce únicamente HEX, RGB(A) numérico y HSL(A) numérico. Convierte antes el nombre a uno de esos formatos.