Barthélémy Pedotti
in contrast

Contrasts produce contours

We call color contrasts the differences that increase the visual perception; Here are six:
    Hue contrast (color per se)
    Luminosity contrast
    Saturation Contrast
    Simultaneous contrast
    Warm-Cold contrast
    Size contrast


Hue contrast: at its highest between complementary colors, just like green on the big red square.

Luminosity contrast: the same reference color mixed with more or less white and black.

Saturation contrast: a saturated blue as a reference (B square, R=0, G=0, B=255), randomly mixed with greys and other colors.

Simultaneous contrast: this contrast is in the grey looking different according to the background color (it gets a "ghost" color). Simultaneous contrast is always at work as it occurs everytime 2 colors are adjoining: as the color changes background, the ghost color changes.

Warm-Cold contrast: so called warm (from red to yellow) and cold (from green to blue) alternating colors.

Size contrast: rather obvious, it is mostly detected as a pattern on a background.


Playing with saturated colors contrasts - greys in the right column.

Do not confuse colors contrasts with visual contrast; the latter is at its highest between yellow and black (i.e. street signs); it sums hue, luminosity and saturation contrasts.

to follow

  • Page Top
  • Crédits:

  • graphics: Bathy PEDOTTI - ex Studio PiRAKI
  • webmaster:

  • CSS Pages (no javascript!) thanks to:
    - Eric, the "w3schools" and to all masters of CSS!