Conversor de Colores
Convierte colores entre HEX, RGB, HSL y RGBA. Selector visual con vista previa en tiempo real.
#10B981rgb(16, 185, 129)hsl(160, 84%, 39%)rgba(16, 185, 129, 1)--color: 160 84% 39%;bg-[#10B981] text-[#10B981]Conversor de Colores Online: HEX, RGB, HSL y Más
Nuestro conversor de colores online te permite transformar colores entre los formatos más utilizados en desarrollo web: HEX, RGB, HSL y RGBA. Con un selector visual intuitivo y campos editables para cada componente del color.
Ya sea que estés diseñando una interfaz en Figma, escribiendo CSS personalizado o configurando variables de Tailwind CSS, esta herramienta te proporciona los valores exactos en el formato que necesitas con un solo clic.
Todos los cálculos se realizan en tu navegador sin enviar datos a servidores externos. Incluye generación automática de valores para CSS custom properties y clases de Tailwind CSS.
¿Cómo funciona?
- 1Selecciona un color
Usa el selector visual nativo o introduce valores directamente en HEX, RGB o HSL.
- 2Visualiza la conversión
Todos los formatos se actualizan automáticamente en tiempo real.
- 3Copia el valor
Haz clic en el botón de copiar junto al formato que necesitas: HEX, RGB, HSL, RGBA, CSS o Tailwind.
Preguntas Frecuentes
RGB define colores por cantidad de Rojo, Verde y Azul (0-255). HSL usa Matiz (0-360°), Saturación (0-100%) y Luminosidad (0-100%), que es más intuitivo para diseñadores porque permite ajustar brillo y viveza independientemente.
HEX es más compacto (#FF5733 vs rgb(255, 87, 51)) y es el formato más utilizado en CSS y diseño web. Sin embargo, RGB es más legible y RGBA permite añadir transparencia.
Puedes usar valores arbitrarios con la sintaxis bg-[#hex], text-[#hex] o definir colores personalizados en tu tailwind.config. También puedes usar el formato HSL para las CSS custom properties de Tailwind.