Simultaneous Contrast
Simultaneous Contrast — 2026, generated SVG, dimensions variable · Luminance · Interactive
After Michel Eugène Chevreul, 1839
Two greys, or one?
Which of the two squares is brighter?
How to look: Look only near the boundary between the two squares.
Share
Reveal the answer
Both squares are the exact same gray (#8a8a8a).
↑ The mechanism, made visible.
Notes — why it looks that way
What is happening
The two squares are filled with one single color code. Pressing “Reveal the answer” joins them with a band of that same color. If the band looks like one unbroken strip with no visible break, that’s proof it’s a single color.
Why it looks that way
Beyond the retina, your visual system emphasizes not raw light levels but the difference between neighbouring regions — a mechanism called lateral inhibition. This exists to judge an object’s own color as constant even as lighting changes, and in daily life it works correctly almost all the time.
- A sheet of white paper still looks white on a cloudy day and on a sunny one
- An apple still looks red even when it falls into shadow
In other words, this isn’t a bug in your brain — it’s a function built to cancel out lighting differences, backfiring in a scene deliberately constructed to trigger it.
What this means for design
The same color code can look different depending on the background it’s placed on. This is why deciding a gray or a text color in isolation, then seeing it change impression once placed against the real background, is such a common experience in UI work.
First described
After Michel Eugène Chevreul, 1839
Source: "De la loi du contraste simultané des couleurs" (The Law of Simultaneous Contrast of Colors)
Media — images and data
- OG / X (1200×630)
- Instagram square (1080×1080)
- Shorts / Reels vertical (1080×1920)
- Answer image — landscape (X)
- Answer image — square (Instagram)
- Answer image — vertical (Shorts)
- Post drafts (JSON)
Free to use for non-commercial purposes such as classes, school projects and blogs, with a link back to this page as the credit. Commercial use is not covered
Every figure is generated here from the phenomenon itself (re-implemented). A phenomenon known for a long time as simultaneous contrast. The figure's color values are generated here from scratch as parameters.


