Colour in composition

Colour is the element viewers respond to fastest and most emotionally. A splash of red pulls the eye across a grey street; a frame bathed in teal and orange feels cinematic; a palette of pale pastels feels gentle and nostalgic. VIS-110 explains the physics and perception of colour: wavelengths, colour spaces, white balance and colour management. This lesson treats colour as a compositional tool: how it creates contrast and focal points, how it carries visual weight and depth, how colour schemes unify an image, how colour sets mood and meaning, and how to design with colour so that images and graphics work for viewers with colour vision deficiencies.

Describing colour: hue, saturation and value

Artists and designers describe any colour by three properties:

• Hue: the colour family, such as red, yellow, green, blue, named by its position on the colour wheel.
• Saturation (also called chroma or intensity): how pure or vivid the colour is, from grey to fully saturated.
• Value (lightness): how light or dark it is, independent of hue (Lesson 1 showed that value contrast does most of the work of separating subject from background).

A useful insight is that these three properties act somewhat independently in composition. Two colours of different hue but the same value merge into one shape when converted to black and white, and can be hard to distinguish for some viewers; colours of very different value always separate. Saturation controls how loudly a colour calls for attention.

Colour contrast

The painter and teacher Johannes Itten, at the Bauhaus in the 1920s, described seven kinds of colour contrast that remain a useful checklist:

In photography and film, the most useful are value, warm-cool, complementary and saturation contrast. A subject in a saturated colour against a muted background becomes an immediate focal point (Lesson 9), which is why a red coat or a yellow raincoat appears in so many street photographs and films. Complementary pairs, such as orange skin tones against a teal or blue background, separate subjects strongly and are the basis of the "teal and orange" look common in contemporary films and advertising, popular partly because skin tones fall in the orange range and the complement pushes them forward.

Colour weight and balance

Colours carry visual weight (Lesson 5). In general, warm colours weigh more than cool, saturated more than muted, and, against a light background, dark more than light. A small area of intense red can balance a large area of pale blue. Goethe proposed proportions for balancing colours by their apparent brightness, such as yellow to violet in about 1:3 and red to green 1:1; the exact ratios matter less than the principle that strong colours need less area to hold their own. A common design guideline, the 60-30-10 rule, uses a dominant colour for about 60% of a layout, a secondary colour for 30%, and an accent for 10%, giving a clear hierarchy.

Colour also affects apparent position in depth. Warm, saturated colours seem to advance toward the viewer, while cool, desaturated colours recede. Landscape painters exploited this with aerial perspective: distant hills are painted bluer, lighter and less saturated because the atmosphere scatters light, and the effect makes them read as far away (Lesson 7). A photographer can strengthen depth by placing warm subjects in front of cool, hazy backgrounds and weaken it by doing the reverse.

Colour schemes

Colour schemes, or harmonies, are combinations that tend to look coherent:

• Monochromatic: tints and shades of one hue. Calm, unified and elegant, but risks monotony; value contrast does the separating.
• Analogous: three or four neighbouring hues, such as yellow, orange and red in an autumn forest, or blues and greens in a seascape. Harmonious and natural; one hue usually dominates.
• Complementary: two opposite hues. Vibrant and high-contrast; usually one dominates and the other is an accent, as equal areas of saturated complements can clash.
• Split-complementary: a hue and the two neighbours of its complement, such as blue with yellow-orange and red-orange. Strong contrast with less tension than a direct complement.
• Triadic: three hues equally spaced on the wheel, such as red, yellow and blue. Lively and balanced; often used with one dominant and two accents.

A photographer cannot always choose the colours of a scene, but can choose what to include and exclude, when to shoot, and what the subject wears. Filmmakers go further: production designers, costume designers and colourists plan a film's palette, often assigning colours to characters, places or emotional states, and changing the palette as the story develops.

Colour, mood and meaning

Colours carry associations that come partly from nature and partly from culture:

Beyond individual colours, the overall palette sets mood. Warm, saturated palettes feel energetic and inviting; cool palettes feel calm, clinical or melancholy; desaturated palettes feel serious, gritty or nostalgic; high-key pastel palettes feel light and gentle. Light itself has colour (VIS-110): the warm light of early morning and late afternoon, the "golden hour", feels romantic and nostalgic, while the blue light just after sunset, the "blue hour", feels quiet and mysterious. Choosing when to shoot is often choosing a palette.

Colour grading as composition

In film, video and much photography, colour is adjusted after capture in colour correction and grading. Correction fixes technical problems, making white balance and exposure consistent between shots. Grading is creative: it shapes the palette to direct attention and set mood. Compositional uses of grading include:

• Separating subject and background with complementary colours, such as warming skin and cooling shadows.
• Using power windows (masks) to brighten or saturate the subject slightly and darken the edges of the frame, guiding the eye inward like a vignette.
• Reducing saturation in distracting background colours, such as a bright green sign behind a speaker.
• Keeping a consistent palette across a sequence so that the story, not colour changes, carries attention (Lesson 11).

Grading is most effective when it reinforces choices made earlier in production design, costume and lighting. Heavy grading cannot rescue a scene whose colours fight the composition.

Palette plans like this are often summarized in a colour script, a strip of small frames or swatches showing the dominant colours of each scene in order. Animation studios use colour scripts to plan entire films, and live-action productions use mood boards and reference stills in the same way, so that every department works toward the same visual arc.

Colour accessibility

About 8% of men and 0.5% of women of Northern European ancestry have some form of colour vision deficiency, most commonly reduced sensitivity to red or green. For them, red and green of similar value can look alike, and colour-coded information, such as a red and green chart, a map legend, or a "go" button distinguished only by hue, can be unreadable. Good practice:

• Never rely on hue alone to carry meaning; add value contrast, labels, patterns or shapes.
• Check designs in greyscale: if important elements merge, increase their value contrast.
• Use colour-blind-safe palettes for charts and diagrams, for example blue and orange rather than red and green.
• For text, meet contrast guidelines: the Web Content Accessibility Guidelines (WCAG) require a luminance contrast ratio of at least 4.5:1 for normal text and 3:1 for large text, calculated as in Lesson 1.