colourtextcontrast
pink face
compare grey squares
stripes 1
neon effects
contrasts 2
  • 1
  • 2
  • 1
  • 1

Simultanious contrast II

Aftereffects

example 1a

fixate the black dot for 20-30 seconds, then move your cursor over the image edge to see it change. what do you see now on the white area?

pink frame

example 1b:

again, focus onto the middle of the image for about 20-30 seconds, then move the cursor inside the image to see it change to a face. do the two halfs of the face look alike in their colour appearance?

half white - half pink

example 2a

look at the two images, one with white, one with black background and pay attention to the background areas between the coloured squares. do they appear completely white/black?

example 2b

now look at that rather mild version of a text example:

example 3

look at B for a while - do you notice you are trying to assume a negative grid on it? it's not a colour issue - when you enter /exit the grid you can change the yellow to darkviolet / back to yellow

effect

after fixating the eye on pink colour you'll see the frame greenish on the white background (example 1a) or the right part of the photograph looks greenish (example 1b)

at example 2 between the coloured squares where the white and black 'streets' cross eachother you get a milder colour square (milder brecause the underlying white or black reduces the luminosity)

example 3 lets you see a ongoing (negative) pattern even throughout the letter varying to occupy different amounts of the letter

explanation

aftereffect of the pink frame / halfgreenish face:

  • the eye's colour sensitive cones are activated by the colour over a period of time, such tiring them
    (tiring stands for: the »vision pigment« Rhodopsin in the eye is bleached by the light after some time)
  • as the fatigued cones can't help to create the impression of white (for which all cones have to be fully activated) a complementary vision of the image is produced in the brain
  • the effect of ‘afterburning’ images grows with the intensity and saturation of colours

example 2 ‘hallucination’ of same coloured squares in the gaps between real squares:

  • as staring at many individual objects requires more single calculations in the brain and especially is exhausting with such patterns and coloured squares, the brain tries to apply one rule to one whole area and to continue to see the same colour in the gaps
  • they are not that bright because of the underlying background colour

example 3 with the big 'B'

  • the big B on the grid somewhat ‘disturbs’ the continuation of the grid (which is more dominant because of it's ‘eye-catching’ pattern, and the brain tries to let the grid be complete, even over the B's area
  • the edge's area where one ‘adds / continues seeing’ a repetition of a pattern of a negative colour depends on the pattern outside or the width / height of pattern areas / letters' white spaces, etc.

advice

  • bear this effect in you mind when you create screen pages that e.g. have a steady intense background colour or element that stays at the same position: when the layout changes suddenly or because of scrolling or a new window pops up the user might not see things in the colours intented or, worse, will not be able to read certain text
  • and: when you have text rich in colour and contrast the eye/brain produces slight afterimages during reading, such influencing the whole reading process - that's why e.g. reading yellow text on blue background is very difficult.
  • be gentle to the eye: don't use high brightness contrasts, reading black text on white background on-screen is a strength to the eye as well! The light ratio of white to black is 16:1, while eye friendly recommendation is approximately 3:1!
SOON
SOON
SOON