Skip to content

Color, Explained

Color isn't sitting in the paint. It happens in your eye, in your brain, and in whatever color is standing next door.

6 min readReadInteractive

In 1824 the Gobelins tapestry works in Paris had a complaint on its hands: the black wool looked weak, almost reddish. The chemist put in charge of its dyes, Michel-Eugène Chevreul, tested them and found the black was fine. The trouble was the deep blue and violet threads woven beside it. The black only looked wrong because of its neighbors.

Chevreul spent years on that puzzle, and in 1839 he published a book on what he called the simultaneous contrast of colors. Its lesson is the big idea of this piece: a color is never seen alone. Once you get that, you can use color on purpose instead of by luck: on a canvas, a slide, a living-room wall or a phone screen.

Three dials for any color

Your retina has three kinds of cone cells, tuned to short, medium and long wavelengths of light. Their sensitivities overlap a lot, and your brain works out color by comparing how strongly each kind responds. That is why three numbers are enough to describe any color you can see. Artists usually name them like this:

DialWhat it meansEveryday words
HueWhere it sits around the wheelred, orange, teal
Saturation (or chroma)How pure or how grayed-down it isvivid vs. muted, dusty
Value (or lightness)How light or dark it ispale, deep, navy

Most beginners think about hue. Most professionals think about value first. Hold that thought; the third demo below is about it.

Light adds, paint subtracts

There are two ways to mix color, and they behave in opposite directions. A screen makes color with light: red, green and blue light added together build toward white. Paint and ink work by absorbing light, so every pigment you add takes something away, and mixtures slide toward a muddy dark. Your printer uses cyan, magenta and yellow (plus black) for exactly this reason.

Light: adds toward white Ink: subtracts toward dark

Screens add light (left); printers and painters subtract it (right). The same "mix two colors" instruction gives opposite results.

The wheel, and the colors that fight

In his Opticks of 1704, Isaac Newton took the band of colors from a prism and bent it into a circle, joining red to violet. Every color wheel since is a descendant of that move. Colors directly across the wheel are called complements. Put them side by side and each makes the other look more intense.

Vincent van Gogh used that on purpose. Of his Night Café (1888), with its blood-red walls and green ceiling and billiard table, he wrote to his brother Theo that he had tried "to express the terrible passions of humanity by means of red and green."

Try it 1
Spin the wheel

Pick a starting hue, then a harmony. The wheel marks which colors belong together under each classic scheme.

Complementary: straight across the wheel. Analogous: next-door neighbors. Triadic: three colors evenly spaced. Split-complement: one color plus the two neighbors of its opposite.

An honest complication: there is more than one wheel. The painter's traditional red-yellow-blue wheel puts green opposite red. The screen wheel above, built from red, green and blue light, puts cyan opposite red. Neither is "the true one." They are maps for different materials, and the demo uses the screen version because you are reading on a screen.

Color harmonies are not laws. They are reliable starting points, the way a chord is a starting point for a song.

Neighbors change everything

Here is Chevreul's discovery in action. A color drifts away from its neighbor: next to yellow, a gray leans bluish; next to blue, the same gray leans yellowish. Next to black it looks pale; next to white it looks dark. The painter and teacher Josef Albers built a whole course on this, published as Interaction of Color in 1963, and he called color "the most relative medium in art."

Try it 2
Two grays that are one gray

Both small squares are exactly the same gray. Change the surroundings, then join the squares and watch the difference evaporate.

Value does the heavy lifting

Strip the color out of a photo and it usually still reads perfectly well. That's because your visual system finds edges, faces and depth mostly from light-and-dark contrast. Two colors can be wildly different in hue and nearly identical in value, and then the boundary between them shimmers and goes soft. Designers call it vibration; readers call it a headache.

This is also why accessibility rules for text measure value, not hue. The Web Content Accessibility Guidelines ask for a contrast ratio of at least 4.5 to 1 for normal text and 3 to 1 for large text, on a scale that runs from 1:1 (identical) to 21:1 (black on white).

Try it 3
Hue contrast is not value contrast

Set a text color and a background. The ratio is the standard accessibility formula. Switch on grayscale to see what your eye's edge-detector sees.

Can you read this comfortably?

Pure red (#ff0000) on a mid green (#009400) has a contrast ratio of 1.00 to 1: in grayscale both become the same gray. Navy (#001166) on cream (#fff5d6) is about 15 to 1.

Warm, cool and what colors "mean"

Reds, oranges and yellows tend to read as warm and near; blues and greens as cool and far. Landscape painters lean on that: distant hills go bluer and paler, a trick covered in this library's piece on perspective. What colors mean, though (mourning, luck, danger, purity) is learned, and it changes from culture to culture and century to century. Treat any chart that says "blue means trust" as marketing folklore, not science.

Quick check

1. You mix red and green light on a screen. What do you get?

  • Brown
  • Yellow
  • Gray

Answer: yellow. Light adds, so red plus green light makes yellow. Mix red and green paint and you get a brownish dark, because pigments subtract.

2. A gray square looks bluish on a yellow wall. What is happening?

  • The gray paint is slightly blue
  • Simultaneous contrast: a color drifts away from its neighbor
  • The light in the room is blue

Answer: simultaneous contrast. Your brain exaggerates differences at boundaries, pushing the gray toward yellow's opposite. Chevreul described it in 1839.

3. Pure red text on a mid green background is hard to read. Why?

  • Red and green are complements, which always clash
  • They have almost the same value, so there is no light-dark edge
  • Screens can't show red and green together

Answer: equal value. Complements can work together beautifully if one is lighter than the other. With no value contrast, the edge vibrates and the letters blur.

The takeaway

Every color has three dials: hue, saturation and value. Light mixes toward white and paint toward dark. Complements intensify each other, neighbors shift each other, and value, not hue, carries most of what the eye needs to read an image. Use the wheel to choose, then check the values.

Try this: take a photo of a room, outfit or slide you've designed and set it to black and white. If the important thing doesn't stand out in gray, it doesn't really stand out in color either. Adjust the light-dark contrast first.

Sources: Michel-Eugène Chevreul, De la loi du contraste simultané des couleurs (1839; English, The Principles of Harmony and Contrast of Colours, 1854), and the history of his Gobelins work. Isaac Newton, Opticks (1704). Vincent van Gogh, letter 676 to Theo, 8 September 1888 (Van Gogh Museum letters edition). Josef Albers, Interaction of Color (Yale, 1963). W3C, Web Content Accessibility Guidelines 2.1, contrast ratio definition. Cone-sensitivity basics from Purves et al., Neuroscience (NCBI Bookshelf).

Go deeper:
📘 Interaction of Color by Josef Albers (the classic hands-on course; the 50th-anniversary edition reproduces the studies)
📘 Color and Light: A Guide for the Realist Painter by James Gurney (how color behaves in real light, beautifully explained)
🌐 Van Gogh's letter about The Night Café (in full, with notes)
🌐 W3C: the contrast-ratio definition used in demo 3
🌐 Related pieces in this library: How to Look at a Painting · Perspective: How a Flat Surface Fakes Depth