Convertidor de RGBA a HEX
Convierte colores rgba() a HEX. Obtén el código #RRGGBBAA de 8 dígitos que conserva la transparencia, o aplana el color sobre un fondo para obtener el HEX sólido que realmente ves, para herramientas que no admiten alfa.
Última actualización:
Acepta rgba(), rgb(R G B / A), porcentajes y números simples.
Cómo usar Convertidor de RGBA a HEX
- Pega un valor rgba() como rgba(47, 107, 79, 0.5), o ajusta rojo, verde, azul y alfa con los controles deslizantes.
- Copia el HEX de 8 dígitos si tu aplicación o tu CSS admite transparencia en HEX.
- ¿Necesitas un color sólido? Deja activado “Aplanar sobre un fondo” y elige el fondo sobre el que va el color.
- Copia el HEX aplanado: coincide con lo que ves sobre ese fondo, sin transparencia.
- ¿Estás creando una app Android? Usa el valor ARGB, que pone el alfa primero.
Fórmulas de RGBA a HEX
HEX de 8 dígitos (conserva la transparencia): escribe R, G y B (0–255) como dos dígitos hexadecimales cada uno y añade el alfa como round(alfa × 255) en hex. El resultado es #RRGGBBAA.
HEX aplanado (color sólido): mezcla cada canal con el fondo y luego conviértelo a HEX:
- R = Rcolor × alfa + Rfondo × (1 − alfa)
- G = Gcolor × alfa + Gfondo × (1 − alfa)
- B = Bcolor × alfa + Bfondo × (1 − alfa)
Es la mezcla alfa estándar “source-over” que usan los navegadores para dibujar un color transparente sobre un fondo opaco (en sRGB sin corrección gamma).
Ejemplos
| RGBA | HEX de 8 dígitos | Aplanado sobre blanco | Aplanado sobre negro |
|---|---|---|---|
| rgba(0, 0, 0, 0.5) | #00000080 | #808080 | #000000 |
| rgba(0, 0, 0, 0.1) | #0000001A | #E6E6E6 | #000000 |
| rgba(255, 255, 255, 0.5) | #FFFFFF80 | #FFFFFF | #808080 |
| rgba(255, 0, 0, 0.5) | #FF000080 | #FF8080 | #800000 |
| rgba(0, 0, 255, 0.25) | #0000FF40 | #BFBFFF | #000040 |
| rgba(47, 107, 79, 0.75) | #2F6B4FBF | #63907B | #23503B |
¿Qué HEX debo usar?
- CSS para navegadores modernos: el HEX de 8 dígitos o el rgba() original funcionan y se mantienen transparentes.
- Plantillas de correo, PDF, impresión y aplicaciones antiguas: usa el HEX aplanado, porque muchas ignoran el alfa o lo gestionan mal.
- Entrega de diseño: da ambos. Los diseñadores suelen especificar “negro al 60%”, mientras que los desarrolladores necesitan el color sólido exacto para un fondo concreto.
- ¿Quieres hacerlo al revés? Usa HEX a RGBA. ¿Quieres mezclar dos colores sólidos? Prueba el Mezclador de colores.
Preguntas frecuentes
¿Cómo convierto RGBA a HEX?
Convierte el rojo, el verde y el azul (0–255) en dos dígitos hexadecimales cada uno y luego convierte el alfa multiplicándolo por 255, redondeando y escribiéndolo como otros dos dígitos hex. rgba(47, 107, 79, 0.5) se convierte en 2F, 6B, 4F y 0.5 × 255 = 127.5 → 128 = 80, es decir, #2F6B4F80.
¿Qué significa aplanar un color transparente?
Mezcla el color con el fondo sobre el que está, así obtienes un único color sólido: resultado = color × alfa + fondo × (1 − alfa) para cada canal. rgba(0, 0, 0, 0.5) sobre blanco se convierte en #808080. Es útil para correos electrónicos, impresión, PDF y herramientas que ignoran el alfa.
¿Por qué el alfa del HEX de 8 dígitos es ligeramente distinto de mi valor?
El alfa en HEX solo tiene 256 pasos (de 00 a FF). Un alfa de 0.5 se convierte en 80 (128), que al leerse de nuevo da 0.502. La diferencia es inferior al 0.2% e invisible.
¿Qué es el formato ARGB?
Android y algunas otras plataformas escriben los colores como #AARRGGBB, con el alfa primero. El mismo color que #2F6B4F80 en CSS es #802F6B4F en el XML de Android.
¿Todos los navegadores admiten HEX de 8 dígitos?
Sí, todas las versiones actuales de Chrome, Edge, Firefox y Safari admiten #RRGGBBAA y #RGBA en CSS. Algunos programas antiguos, clientes de correo y herramientas de diseño no; usa ahí el HEX aplanado o rgba().
¿Puedo introducir los valores RGB como porcentajes?
Sí. rgb(100% 50% 0%) se convierte con 100% = 255. El alfa puede escribirse como 0–1 o como porcentaje, por ejemplo rgb(255 128 0 / 50%).
¿Se prueban todas las herramientas de FreeToolCabin para comprobar su calidad y precisión?
Sí. Cada herramienta del sitio pasa pruebas automáticas en navegadores reales para comprobar que el resultado es correcto y que no hay errores. Si encuentras un fallo o tienes una sugerencia, escríbenos a [email protected] y lo revisaremos.