Utilore

RGB a HEX

Pega rgb(31, 95, 214) —con comas o con espacios, da igual— y obtén #1f5fd6, listo para CSS, un archivo de diseño o una guía de estilo.

  • #1f5fd6 HEX
  • rgb(31, 95, 214) RGB
  • hsl(219, 75%, 48%) HSL

Contraste:

Cómo usarlo

  1. Pega el valor RGB o RGBA, o elige un color con el selector.
  2. Lee el código HEX encima de los demás formatos.
  3. Pulsa «Copiar» junto a la línea HEX.

Lo que conviene saber

Por qué los diseñadores piden HEX

HEX es un solo token en vez de tres números, así que se pega en una especificación, un ticket o un chat sin perder ningún dígito. Además es la notación que muestran por defecto las herramientas de diseño, de modo que una paleta escrita en HEX coincide con lo que ve todo el mundo.

Qué ocurre con el canal alfa

Si pasas un rgba() con transparencia, el resultado es un HEX de ocho dígitos: el último par codifica el alfa de 0 a 255. Los navegadores modernos lo leen bien; los antiguos no, así que conserva rgba() donde necesites compatibilidad amplia.

Preguntas frecuentes

¿Tengo que escribir rgb(...) alrededor de los números?

Se acepta la notación completa con comas o espacios, tanto en rgb() como en rgba(). Los valores por encima de 255 se ajustan al máximo en vez de dar la vuelta en silencio.

¿Por qué mi HEX tiene ocho caracteres?

Porque el color lleva canal alfa. Quita la transparencia y obtendrás el código habitual de seis dígitos.

¿Se envía algo a un servidor?

No. Toda la conversión ocurre en la página, así que los colores de marca aún inéditos se quedan contigo.

Herramientas relacionadas