Contrast GridAA / AAA

Contrast Grid / Colour wall

Accessible Data Visualisation Colour

Build charts with luminance, line style, labels and ordering so data remains distinguishable beyond hue alone.

Working premise

Charts often place many colours beside each other, over grid lines and under small labels. Accessibility improves when colour reinforces a structure already communicated through direct labels, position, pattern, shape or line style.

01

Start with the analytical question

Decide which series must be compared and which differences are secondary. A palette with twelve equally vivid colours can be harder to understand than a hierarchy using one highlight and restrained context series.

02

Use redundant encodings

Combine colour with direct labels, marker shapes, dash patterns, line thickness or ordered position. Legends require eye travel and colour matching; labelling a series near its line often reduces both cognitive and colour-perception load.

03

Measure labels and meaningful graphics

Axis labels and annotations need text contrast. Lines, points and bars that carry meaning need sufficient contrast against their background and, where overlap matters, against one another. Thin anti-aliased lines may need more than a numeric minimum.

04

Test alternative perception

Inspect greyscale, colour-vision simulations and print output, but do not treat a simulation as the experience of every user. Ask whether the intended conclusion remains available without colour and whether interactive details can be reached by keyboard or screen reader.

Field checks

  • Limit colours to the distinctions the question requires.
  • Add labels, shapes, patterns or line styles.
  • Check graphics against the plot background.
  • Keep tooltip information available by keyboard or in a table.
  • Verify the conclusion in greyscale and print.

A colour matrix helps choose pairs but does not make an inaccessible chart interaction, reading order or data description conformant.

SignalRecordDecision use
Series identitylabel + stylefollow one series
Emphasisluminance + annotationfind the key result
Fallbackdata table or summaryaccess exact values