Antecedentes sobre la percepción del color:
Debido a la naturaleza del ojo humano y al procesamiento visual del cerebro, existe una ilusión óptica de que el mismo color se verá diferente dependiendo del fondo .
Se conoce como el efecto de contraste , ilustrado a continuación: los rectángulos centrales son idénticos:
Fuente: Wikimedia
Una ilustración (e informe) de la NASA hace que el efecto del color de fondo sea aún más obvio:
Fuente: Laboratorio de investigación de uso de color de la NASA
(Observe cómo los dos colores superiores en la segunda imagen parecen iguales, pero en realidad son completamente diferentes).
¿Qué pasa con el diseño web?
Mi pregunta se refiere al diseño web, específicamente en este caso, el color del texto del enlace en diferentes fondos.
Para un color de texto dado, ¿cómo se puede encontrar el color complementario para que se vea igual en cierto fondo?
Echemos un vistazo a un ejemplo para esta pregunta:
Considere mi ejemplo a continuación, con texto amarillo #FFF000
en los siguientes fondos:
- blanca
#FFFFFF
, - negro
#000000
, - y gris
#555555
.
Como se esperaba, no se ve igual en absoluto. ( Vea y descargue el archivo .PSD aquí ) .
¿Cómo podemos hacer que se vea igual en los tres? Claramente, el texto en el fondo blanco debe ser un amarillo más oscuro, y el que está en el gris necesita ajustes de tono / tono. (El texto que lo rodea también lo afectará, pero es probable que sea más difícil de explicar).
¿Se puede calcular este color perfecto de alguna manera, en base al Hex, RGB u otro sistema? Ahí es donde está el quid de esta pregunta, ya que sería mucho más eficiente que la aproximación manual.