The Brewer palette for colour deficiency

The Brewer palette is a set of colours named after Cynthia Brewer, a researcher at Pennsylvania State University. Brewer conducted research into creating maps that people with colour deficiency (colourblindness) can read and understand.

We suggest the use of the Brewer palette for Web pages where adjoining or overlapping items must use different colours yet must also be accessible to colour-deficient people. Typical examples are navbars (with adjoining selectable areas) and long documents with many heading levels (where colour is used as an additional cue to differentiate heading level).

The Brewer palette provides two categories of information:

  • Colour pairs that can be used together
  • Colour steps (or gradations) that can be used to show a progression or to differentiate objects

If you have to differentiate two items clearly, you may use one of the colour pairs. If you need to differentiate a related range of items, you may use colour steps.

Listed below are colour pairs and colour steps that are safe for people with colour-vision deficiencies and whose names are also unambiguous.

  • Red/blue
    • Steps: Dark red; medium red; light red; light blue; medium blue; dark blue
  • Orange/blue
    • Steps: Dark orange; medium orange; light orange; light blue; medium blue; dark blue
  • Orange/purple
    • Steps: Dark orange; medium orange; light orange; light purple; medium purple; dark purple
  • Yellow/purple
    • Steps (note the restricted list): Yellow; light purple; medium purple; dark purple
  • Brown/blue
    • Steps: Dark brown; medium brown; light brown; light blue; medium blue; dark blue
  • Yellow/blue
    • Steps: Yellow; light blue; medium blue; dark blue

Not every Web site will require specific work to avoid confusable colour combinations. But if your site is one of those, you may use these colour pairs and colour steps.