Sorry, your browser doesn't support canvas element !
Sorry, your browser doesn't support canvas element !
Neon Color Spreading
Only the intersection crosses are colored, but that color appears to spread
beyond the lines to fill in an illusory circular surface
2
deg
3
% of separation
50
% of separation
60
deg
100
%
100
%
100
%
v1.0
© 2020 KyberVision - Innovation in Vision Sciences
Send Feedback
Neon color spreading is a completion phenomenon characterized by chromatic and lightness induction. It occurs when sections of a grid are replaced by segments of a different color. This color appears to diffuse out of the segments, and produce a slightly tinted transparent surface floating above the grid. First reported by Varin in 1971 in his monograph on ‘Chromatic Contrast and Diffusion Phenomena’, this illusion was rediscovered by van Tuijl (1975) and named the neon-like color spreading because of the perceived combined tint and glow.

The basic element of this stimulus consists in an Ehrenstein figure (four black radial lines separated by a central gap). A clearly delineated bright illusory disk is normally perceived here, but if the inner endpoints of the lines are connected by a colored cross the disk becomes translucent and misty. The circular veil of color in the illusory area has the same hue as the inducing cross and uniform across the illusory disk.

It has been shown that this effect cannot be attributed to chromatic aberration or eye movements, it is enhanced by flicker and weakened if stimuli are oriented obliquely, and it does not occur with dichoptic presentation. A maximum illusion also requires that the Ehrenstein figure and cross are laterally and angularly aligned for good perceptual continuation (Redies & Spillmann 1981). It has been suggested the neon colour is an additive mixture of the colour of the segments and the colour complementary to the lattice (Bressan 1995; da Pos & Bressan 2003).

With this interactive widget, you can explore the effect of several parameters on this illusion, for example:
  • keep the inducer brightness to 100% and set its saturation to 0% to show the Ehrenstein figure alone without the colored inducers,
  • then lower the inducer brightness to 100%, and you will notice that this illusion is not limited to colored inducers as it also works with achromatic inducers,
  • you can lower the grid contrast and notice a reduction in the effect.

References:

  Varin (1971) Fenomeni di contrasto e diffusione cromatica nell'organizzazione spaziale del campo percettivo. Rivista di Psicologia 65:101–128

  Van Tuijl (1975) A new visual illusion: neonlike color spreading and complementary color induction between subjective contours. Acta Psychologica 39(6):441–445

  Van Tuijl & de Weert,(1979) Sensory conditions for the occurrence of the neon spreading illusion. Perception 8(2):211–215

  Redies & Spillmann (1981) The neon color effect in the Ehrenstein illusion. Perception 10(6):667–681

  Redies et al. (1984) Colored neon flanks and line gap enhancement. Vision Vision Research 24(10):1301–1309

  Bressan (1995) A closer look at the dependence of neon color spreading on wavelength and illuminance. Vision Research 35(3):375–379

  Bressan et al. (1997) Neon color spreading: a review. Perception 26(11):1353–1366

  da Pos & Bressan (2003) Chromatic induction in neon colour spreading. Vision Research 43(6):697–706

  Kitaoka et al. (2007) Two competing mechanisms underlying neon color spreading, visual phantoms and grating induction. Vision Research 41(18):2347–2354
Here is the math behind this stimulus:

  thickness = th/100
  hgrid = rectanglewave(x,sep,-thickness/2,thickness)
  vgrid = rectanglewave(y,sep,-thickness/2,thickness)
  grid = bool(hgrid) | bool(vgrid)
  fillin = indsize/100
  phase = fillin/2
  hinducer = rectanglewave(x,sep,-phase,fillin)*vgrid
  vinducer = rectanglewave(y,sep,-phase,fillin)*hgrid
  inducer = bool(hinducer) | bool(vinducer)
  hue = indh+180
  b = indb/100; s = inds/100; hi = floor(hue/60); f = (hue-hi*60)/60
  p = b*(1-s); q = b*(1-f*s); t = b*(1-(1-f)*s);
  red = rhsb(hi,b,p,q,t); green = ghsb(hi,b,p,q,t); blue = bhsb(hi,b,p,q,t)
  common = (1-inducer)-(grid-inducer)*gcnt/100
  zr = common + inducer*red
  zg = common + inducer*green
  zb = common + inducer*blue

Where:

  'sep' is the lines separation (in deg)
  'th' is the line thickness (in % of separation)
  'indsize' is the inducer size (in % of separation)
  'indh' is the inducer hue (in deg)
  'indb' is the inducer brightness (in %)
  'inds' is the inducer saturation (in %)
  'gcnt' is the grid contrast (in %)
The whole stimulus is generated in real-time using a GLSL shader that runs right inside your WebGL-compatible browser. The plain Math behind the stimulus was converted to this optimized GLSL shader using the new Psykinematix Pro Edition. Translation to Matlab and Python code is also possible !

This whole widget was also fully generated using Psykinematix Pro Edition. The parameters that control the stimulus properties through the sliders are the same as the ones you would define as dependent or independent variables when using the stimulus in an actual psychophysical experiment run in Psykinematix. The widget creation is otherwise fully customizable with your own logo, copyright, links, etc.

To learn more about the widget creation, click on the above "Made With" button !
v1.0
© 2020 KyberVision - Innovation in Vision Sciences