¿Debo usar Hex o RGBA al diseñar un sitio web?

Sé que esto ya apareció en StackOverflow:

Pero me gustaría preguntar aquí ya que probablemente todos somos más técnicos con nuestra selección de colores y podríamos estar usándolos en HEX, RGB y CMYK. Personalmente, mi preferencia en los últimos años es usar RGBA. Simplemente lo encuentro más fácil de recordar. Conozco ciertos códigos HEX (¿son códigos?) pero conozco un montón de códigos RGB y puedo hacer estimaciones bastante buenas en cualquier color que pueda necesitar.

El argumento principal que he visto es Copiar y pegar uno, frente a tres. ¿Existen otras diferencias en el perfil de color?

¿Hay alguna razón por la que la mayoría de los programadores todavía prefieran el formato HEX?

Con las técnicas de impresión modernas, ¿qué otras advertencias, si las hay, podría enfrentar un diseñador si opta por HEX y luego trata de encontrar un color CMYK similar?

Respuestas (2)

Al navegador realmente no le importa en qué formato está el color, el rendimiento es insignificante. Como tal, me centraré en los efectos de la decisión sobre los desarrolladores y los casos de uso.

Muchos desarrolladores encuentran que los valores HEX son más fáciles de leer que RGB o HSL. Como tal, tiendo a usar HEX para que el próximo desarrollador que trabaje en el proyecto pueda tener un trabajo más fácil, aunque sea un poco. Sin embargo, si los desarrolladores están más familiarizados con otro tipo, no es un problema usarlo.

Una de las pocas veces que es necesario un tipo de color específico es cuando se requiere cambiar el nivel alfa. Esto se debe a que opacitycambia el orden de apilamiento . Como tal, cuando el nivel alfa debe ser diferente a uno, a veces es preferible usar HSLa o RGBa en lugar de la opacitypropiedad.

Cuando se trata de animar colores , es preferible trabajar en RGB o HSL que en HEX simplemente porque los números son más fáciles de editar dinámicamente. HSL es excelente para animaciones que atraviesan el espectro porque el color está determinado por un número, el tono, siempre que la saturación y la luminosidad no necesiten cambiarse.

En última instancia, no importa demasiado, siempre que no sea un caso especial. Lo más importante es mantener la coherencia en el tipo que se utiliza en cada proyecto tanto como sea posible porque ayuda a la productividad.

¿Alguna idea de qué efecto tiene HEX, si es que tiene alguno, cuando desea producir materiales impresos también con la misma marca?
@Ryan HEX está en la gama RGB. No puede imprimir la gama RGB, debe utilizar la gama CMYK para imprimir. No hay una relación directa entre HEX y CMYK. Tienes que convertir todo a CMYK y luego posiblemente ajustar los colores dependiendo de cuánto altere la conversión los colores originales. La mayoría de las marcas incluyen al menos valores RGB y CMYK por este motivo. A menudo, las pautas de la marca tendrán desgloses de colores RGB, HEX, CMYK y directos para garantizar el color adecuado en cualquier medio.
Además de lo que se dijo sobre opacitycambiar el orden de apilamiento, también afectará la opacidad de todo el elemento. El uso de rgba o hsla solo afectará la opacidad de la propiedad que recibe color. div{ background: #f00; color: #0f0; opacity: .5}dará como resultado un texto semitransparente. div{ background: rgba(255, 0, 0, .5); color: #0f0}no lo haré

Solo escriba en HSLA. Requiere muy poca gimnasia mental para imaginar o modificar colores (frente a hexadecimal o RGBA), es completamente equivalente a hexadecimal o RGBA en el navegador, tiene un excelente soporte de navegador desde IE9 en adelante, y si solo usa HSLA, nunca tendrá que cambiar el diseño. de su código cuando quiera introducir transparencia; todo lo que haces es reducir el 1 a un número 0.X. Es mucho más consistente y legible.