Conversor HEX RGB
Convierte colores entre HEX, RGB(A) y HSL(A) con actualización en vivo, compatibilidad con alfa y valores CSS listos para copiar.
🔒 Se ejecuta completamente en tu navegador — nada se cargaConvierte formatos de color sin adivinar
Los valores de color pasan a menudo entre herramientas que prefieren formatos distintos. Un diseñador puede entregar un token HEX, una animación CSS puede necesitar canales RGB y un ajuste de tema puede resultar más fácil en HSL. Este conversor HEX RGB mantiene sincronizados los formatos web más habituales para que introduzcas la versión que tienes y copies la que necesitas. La vista previa en vivo también hace evidentes los errores: si escribes mal un canal, la vista previa cambia de inmediato.
El conversor admite el flujo de trabajo CSS cotidiano: HEX de seis dígitos, RGB, RGBA, HSL y HSLA. El alfa se controla por separado porque la opacidad suele ser una decisión de diseño y no parte de un token de color de marca. Pon el alfa en uno para colores opacos, o bájalo para crear superposiciones, anillos de foco, sombras y fondos translúcidos que siguen usando el mismo tono base.
Cuándo usar RGB, RGBA, HSL o HSLA
RGB es una descripción directa del color en pantalla y resulta útil cuando igualas valores de capturas, salidas de canvas o herramientas de diseño antiguas. RGBA añade transparencia, cómoda para superposiciones y bordes sutiles. HSL describe el color en términos de tono, saturación y luminosidad, por lo que es más natural cuando quieres crear colores relacionados: gira el tono para un nuevo acento, reduce la saturación para un estado atenuado o aumenta la luminosidad para obtener un tinte. HSLA añade el mismo control alfa a ese modelo más legible.
Valores fiables para CSS y tokens de diseño
La coherencia en las conversiones es importante en los sistemas de diseño. Los errores de redondeo o las erratas copiadas pueden crear colores casi duplicados, difíciles de detectar pero costosos de mantener. Esta herramienta limita los canales RGB al rango válido de 0–255, mantiene los porcentajes HSL en el rango de 0–100 y da formato a la salida como CSS listo para pegar. Como funciona en local, puedes convertir con seguridad colores de productos sin lanzar, paletas de clientes o tokens de marca internos sin subirlos a ningún sitio.
Cómo usar
- Introduce un valorEscribe un valor HEX o ajusta los canales RGB y HSL.
- Revisa los formatosEl conversor mantiene sincronizadas las salidas HEX, RGB(A) y HSL(A).
- Copia el CSSUsa los botones de copiar para pegar el formato que necesitas en CSS, tokens de diseño o documentación.