RGB a HEX
Convierte cualquier color RGB a su código HEX al instante. Arrastra los controles deslizantes, escribe los números o pega un valor como rgb(12, 34, 56), y copia el HEX, el HSL o el CSS listo para usar con un clic.
Última actualización:
También acepta rgba(), porcentajes y códigos HEX.
#1E90FF–Colores comunes Haz clic en un color para cargarlo
Cómo usar RGB a HEX
- Introduce tus valores RGB con los controles deslizantes o los campos numéricos (de 0 a 255 cada uno).
- O pega un valor como rgb(12, 34, 56), 12,34,56 o 12 34 56 y pulsa Convertir.
- Lee el código HEX en la muestra y en los resultados. Marca HEX en minúsculas si prefieres #1e90ff.
- Añade transparencia con Incluir alfa para obtener un HEX de 8 dígitos como #1E90FF80.
- Pulsa Copiar junto a HEX, RGB, HSL o la variable CSS para usarlo en tu código o tu aplicación de diseño.
Fórmula de RGB a HEX
HEX es el mismo color RGB escrito en base 16. Cada canal de 0 a 255 se convierte en dos dígitos hexadecimales de 00 a FF: divide el valor entre 16; el número entero es el primer dígito y el resto es el segundo. Los dígitos del 10 al 15 se escriben de la A a la F.
Ejemplo resuelto: rgb(12, 34, 56). 12 ÷ 16 = 0 resto 12, así que 0C. 34 ÷ 16 = 2 resto 2, así que 22. 56 ÷ 16 = 3 resto 8, así que 38. Juntos dan #0C2238.
| Decimal | 0 | 17 | 51 | 102 | 128 | 153 | 204 | 255 |
|---|---|---|---|---|---|---|---|---|
| HEX | 00 | 11 | 33 | 66 | 80 | 99 | CC | FF |
Valores alfa en HEX de 8 dígitos
Con transparencia, se añade un cuarto par al final: alfa × 255, redondeado y escrito en hexadecimal. Estos son los niveles de opacidad más comunes.
| Opacidad | 100% | 90% | 75% | 50% | 25% | 10% | 0% |
|---|---|---|---|---|---|---|---|
| Sufijo HEX | FF | E6 | BF | 80 | 40 | 1A | 00 |
Cómo elegir colores de texto legibles
La muestra indica la relación de contraste de tu color frente a texto blanco y negro, con la fórmula de las WCAG. Se recomienda una relación de al menos 4.5:1 para el texto normal y 3:1 para los títulos grandes. La muestra usa automáticamente el color de texto que se lee mejor. Para hacerlo al revés, de un código HEX a valores RGB, usa HEX a RGB, y para colores de impresión prueba RGB a CMYK.
Preguntas frecuentes
¿Cómo convierto RGB a HEX?
Convierte cada uno de los valores de rojo, verde y azul (de 0 a 255) en un número hexadecimal de dos dígitos y únelos después de un signo #. Para rgb(30, 144, 255): 30 es 1E, 144 es 90 y 255 es FF, así que el código HEX es #1E90FF.
¿Cuál es el código HEX de rgb(255, 255, 255)?
rgb(255, 255, 255) es blanco puro, que en HEX es #FFFFFF, o #FFF en forma corta. rgb(0, 0, 0) es negro, #000000 o #000.
¿Cuándo se puede escribir un color HEX con 3 dígitos?
Un HEX corto como #F80 solo funciona cuando los dos dígitos de cada par son iguales, como en #FF8800. Eso ocurre cuando cada valor RGB es múltiplo de 17, como 0, 17, 34, 51 y así sucesivamente hasta 255. La herramienta muestra la forma corta siempre que es posible.
¿Cómo convierto RGBA a HEX con transparencia?
Marca Incluir alfa y ajusta la opacidad. El valor alfa se multiplica por 255 y se añade como cuarto par, así que una opacidad del 50% se convierte en 80 y rgba(30, 144, 255, 0.5) se convierte en #1E90FF80. Los navegadores modernos admiten HEX de 8 dígitos en CSS.
¿Los códigos de color HEX distinguen entre mayúsculas y minúsculas?
No. #1E90FF y #1e90ff son el mismo color en CSS, HTML y las herramientas de diseño. Usa el estilo que prefiera tu proyecto. La opción HEX en minúsculas cambia la salida.
¿Es mejor RGB o HEX para CSS?
Describen exactamente los mismos colores, así que es cuestión de estilo. HEX es corto y habitual al entregar diseños, mientras que rgb() y hsl() son más fáciles de leer y ajustar, y dejan clara la transparencia.
¿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.