Este conversor de colores css transforma cualquier valor de color en HEX, RGB y HSL a la vez, con una vista previa de muestra en vivo para que veas el tono exacto mientras escribes. Pega un código hex, un valor rgb() o hsl(), o un nombre de color CSS común como blue, teal o gold, y normaliza al instante la entrada en los tres formatos. También maneja la transparencia, incluidos rgba(), hsla() y hex de 8 dígitos con canal alfa. Ya sea que hagas cálculos de hex a rgb para un token de diseño, conviertas de rgb a hex para una hoja de estilos, o revises un valor hsl mientras ajustas una paleta, mantiene todos los formatos sincronizados. Pensado para desarrolladores front-end, diseñadores e ingenieros de QA que manejan formatos de color a diario. Todo se ejecuta de forma local en tu navegador, así que los valores que ingresas nunca salen de tu dispositivo.
Características
Convierte HEX, RGB y HSL a la vez desde una sola entrada
Reconoce nombres de color CSS comunes como blue, teal y gold
Admite transparencia mediante rgba(), hsla() y hex alfa de 8 dígitos
La vista previa de muestra de color en vivo se actualiza al instante mientras escribes
Acepta códigos hex abreviados de 3 y 4 dígitos
Normaliza los valores de canal RGB en porcentaje y de 0 a 255
Muestra un error en línea claro cuando un valor no se puede analizar
Se procesa de forma local en tu navegador
Cómo usar Conversor de colores CSS
Escribe o pega un color en el cuadro de entrada de Color.
Usa un código hex, rgb(), hsl() o un nombre de color CSS como blue.
Lee los valores HEX, RGB y HSL convertidos en las filas de resultados.
Revisa la muestra junto a la entrada para previsualizar el color exacto.
Un valor hex convertido a RGB y HSL con una muestra en vivo coincidente.
Errores comunes y solución de problemas
Aparece "No se pudo analizar ese color" tras escribir un valor. — Usa un código hex válido, rgb()/rgba(), hsl()/hsla() o un nombre de color CSS admitido; los caracteres sueltos o los paréntesis faltantes rompen el análisis.
Un nombre de color CSS como "salmon" no se reconoce. — Solo se admite un conjunto seleccionado de nombres comunes. Ingresa el valor hex o rgb() equivalente en su lugar.
El alfa se pierde tras la conversión. — Incluye el canal alfa en la entrada, como rgba(0,0,0,0.5) o un hex de 8 dígitos como #00000080, y se trasladará a todos los formatos.
Los valores RGB por encima de 255 o los porcentajes se ven mal. — Los canales se limitan al rango válido; pasa números de 0 a 255 o porcentajes de 0% a 100% para obtener el resultado esperado.
Preguntas frecuentes
¿Qué es el Conversor de colores CSS?
Es una herramienta en el navegador que lee cualquier HEX, rgb()/rgba(), hsl()/hsla() o nombre de color CSS común y lo convierte en HEX, RGB y HSL junto con una vista previa de muestra en vivo.
¿Cómo convierto HEX a RGB y HSL con esta herramienta?
Pega un código hex como #3b82f6 en el cuadro de Color, y el Conversor de colores CSS muestra al instante los valores rgb() y hsl() coincidentes en las filas de resultados.
¿El Conversor de colores CSS admite transparencia y canales alfa?
Sí. rgba(), hsla() y hex de 8 dígitos con un valor alfa se analizan todos, y el alfa se conserva en cada formato de salida.
¿Puedo pegar un nombre de color CSS en lugar de un código?
Sí, nombres estándar como blue, teal, gold e indigo se reconocen y se convierten a HEX, RGB y HSL.
¿Acepta códigos hex abreviados?
Sí, los hex abreviados de 3 y 4 dígitos como #f00 o #f00a se expanden automáticamente antes de la conversión.
¿Los valores de color que ingreso se suben a algún lugar?
No. El Conversor de colores CSS se ejecuta por completo en tu navegador, así que los valores que ingresas se procesan de forma local y nunca salen de tu dispositivo.
Herramientas relacionadas
Verificador de contraste — Comprueba la relación de contraste WCAG y si pasa AA/AAA entre dos colores.
Formateador de CSS / SCSS — Embellece o minifica CSS/SCSS/LESS, ordena propiedades y quita duplicados.
Optimizador de SVG — Minifica SVG: elimina comentarios, metadatos y restos del editor, y colapsa espacios.