Colour theory has a reputation for being either obvious or mystical. The obvious version is the colour wheel from primary school. The mystical version is a set of rules about which colours “go together” that designers are supposed to absorb by instinct. The useful version sits between the two: a handful of models that describe how colour behaves, a vocabulary for talking about it precisely, and a few working methods for building palettes that do their job.
Three models, three purposes
Much of the confusion about colour comes from mixing up models that describe different things.
RYB, red, yellow and blue, is the traditional painter’s model. It is the wheel most people learned first, and it still describes the behaviour of many paints reasonably well, though it is a historical convention rather than a precise physical system.
RGB, red, green and blue, is additive colour: the model of light. Screens create colour by adding light from red, green and blue sources. Add all three at full strength and you get white. Everything designed for a screen is ultimately specified in RGB.
CMYK, cyan, magenta, yellow and key (black), is subtractive colour: the model of ink on paper. Each ink absorbs part of the light reflecting off the page. Commercial printing works in CMYK, and the range of colours it can reproduce, its gamut, is smaller than what a screen can show. That is why a bright screen green or electric blue often looks duller in print, and why print work should be checked in a CMYK proof rather than trusted from the monitor.
The practical lesson is to know which world the design will live in and to choose colours that exist there.
The vocabulary
Talking precisely about colour means separating three properties that everyday language blurs together.
- Hue is the colour family: red, orange, blue.
- Saturation, also called chroma, is intensity: how vivid or muted the colour is.
- Value, or lightness, is how light or dark the colour is.
Related terms describe mixtures: a tint is a hue lightened with white, a shade is darkened with black, and a tone is muted with grey.
Of the three properties, value does the most work. A design with good value contrast remains legible when the colour is removed. A design that relies on hue differences alone, a red element against a green one of similar lightness, can collapse entirely in greyscale and is hard to read for many people with colour vision deficiency. A quick test for any layout is to convert it to greyscale and see whether the hierarchy survives.
The colour wheel and its harmonies
Arranging hues in a circle is an old idea. Isaac Newton drew a colour circle in his Opticks, published in 1704, and later theorists built on it. Two twentieth-century teachers shaped how designers are still taught: Johannes Itten, who taught at the Bauhaus and published The Art of Color in 1961, and Josef Albers, whose Interaction of Color appeared in 1963.
The standard harmonies describe relationships between positions on the wheel.
| Harmony | How it is built | Character |
|---|---|---|
| Monochromatic | One hue in several tints, shades and tones | Calm, unified, easy to control |
| Analogous | Neighbouring hues on the wheel | Harmonious, natural, low tension |
| Complementary | Two hues opposite each other | Maximum contrast and energy |
| Split complementary | One hue plus the two neighbours of its complement | Strong contrast with less strain |
| Triadic | Three hues evenly spaced around the wheel | Lively and balanced, hard to manage at full saturation |
These harmonies are starting points, not formulas. Two palettes built on the same complementary pair can feel completely different depending on saturation, value and proportion. A complementary scheme of muted navy and soft terracotta is quiet; the same hues at full saturation vibrate.
Proportion matters more than selection
Most palettes fail not because the colours are wrong but because they are used in equal amounts. Equal quantities of several strong colours compete for attention and nothing wins.
A useful habit is to assign roles. One dominant colour, often a neutral or a muted hue, covers most of the surface. A secondary colour supports it. An accent, used sparingly, marks the things that matter: a call to action, a heading, a highlight. Interior designers often express this as a rough 60, 30 and 10 percent split. It is a rule of thumb rather than a law, but it is a good corrective for the instinct to use every colour in the palette everywhere.
Colour is relative
The central lesson of Albers’s book is that a colour almost never looks the same in two contexts. The same grey appears warmer next to blue and cooler next to orange; a mid-tone looks darker on a white ground than on a black one. His exercises showed how one colour could be made to look like two, and two different colours made to look almost identical, purely through what surrounds them.
For designers this has practical consequences. Test colours in place, at the size and against the backgrounds they will actually appear on, never as isolated swatches. Check them on more than one screen, and on paper if the work will be printed. And be wary of choosing a whole palette from small chips: a colour that looks restrained on a sample card can dominate a large surface.
Contrast and accessibility
Colour choices also decide who can read your work. The Web Content Accessibility Guidelines set measurable contrast ratios between text and its background. At the widely used AA level, normal body text needs a contrast ratio of at least 4.5 to 1, and large text needs at least 3 to 1. The stricter AAA level asks for 7 to 1 for normal text. Free contrast checkers will calculate the ratio for any pair of colours in seconds.
Beyond the numbers, avoid using colour as the only signal. A form error shown only in red, or a chart where two lines differ only in hue, excludes readers who cannot distinguish those colours. Add a label, an icon, a pattern or a change in weight so that the information survives without colour.
Building a palette in practice
- Start from the purpose: what should the viewer feel and do first?
- Choose a dominant colour, then a harmony that suits the purpose.
- Build a range of tints and shades of each colour so you have light and dark options for backgrounds, text and states.
- Test value contrast in greyscale and check text pairs against the contrast guidelines.
- Assign roles and proportions, then apply the palette to a real layout and adjust in context.
Documenting the reasons behind a palette is also worth doing, because the reasoning is what a client or employer is really evaluating. We make the same argument in our piece on what a design portfolio needs: show the decision, not only the swatches.
