Two squares. Two backgrounds. A small experiment in how much of what you see belongs to the thing itself—and how much belongs to its surroundings.
Look at the small squares, not the large backgrounds. Does one look brighter, warmer, or more vivid? Make a prediction before you touch the control.
Both squares are the same coral: #e78c70. The control changes only their
surroundings. Switch it off and the difference may return—even after you know
the answer.
That is the useful surprise: knowing the color's value does not tell you exactly how it will look in a composition. The surrounding colors matter too.
The strength of the effect varies with your display and your vision. If the squares already look alike to you, compare how strongly each stands out from its background.
Try this with colored paper or in a drawing app. Give yourself three minutes.
- Make two identical small squares. Keep their color and size fixed.
- Put each on a different, larger background. Change only those backgrounds until one square feels quiet and the other seems to glow.
- Bring the squares together on one background to check your work.
Show someone the pair before explaining it. Ask what they see. Their observation is more useful than whether they guess the trick.
Next time a button feels dull or an illustration feels too loud, try changing what surrounds it before changing the color itself. Compare the whole composition, not just the isolated swatch.
This original example follows the color-context exercise explored in Josef Albers's Interaction of Color. Go further with the Albers Foundation's One Color Becomes Two.
View source · [Explore the interactive component](./color-context.components.md) · [More examples](./index.md)