Context / color studioExperiment 001

Same hex.
Two appearances.

The two center swatches use exactly the same color. Their surroundings can make them look different. Join them and watch the illusion give itself away.

01 / Trust the pixelsA light surround and a dark surround.

No gradients, filters or transparency on the center swatches. Only the backgrounds differ.

Change the context

The gray may look lighter against the dark field.

Make your own study

1Look before you join.

Does one swatch seem brighter, warmer or more saturated? The effect varies with the palette, display and viewer.

2Remove one variable.

Join the swatches with a strip of the same ink, or give them a shared neutral surround. Their RGB values stay fixed.

3Design in context.

A palette chip is only a starting point. Check a color beside the backgrounds it will actually have.

Take the three-color palette into your own work

Select and copy. These are your chosen colors, not accessibility recommendations.

02 / Let your eyes set the color

Can you match a gray
without its number?

Adjust B until it looks like A. Then reveal the numerical difference. This is a personal observation, not a vision test. The studio above and this exercise are independent.

The reference remains fixed. Only B changes with the slider.

DarkerLighter
Move the slider, then commit to your match.