Ask any data analyst and they will tell you that colour is one of the most powerful tools in data visualisation. For example, it can help highlight patterns, differentiate groups, and direct attention.
But with great power comes great responsibility...if not chosen thoughtfully, colour can also hinder the user experience - especially for individuals with colour vision deficiencies! In fact, around 1 in 12 men and 1 in 200 women have some form of colour blindness, meaning it is likely that some of your dashboard users will struggle with certain colour palettes.
This blog provides practical tips for designing dashboards with accessible colour choices and effective methods to test your visualisations for colour blindness and overall clarity.
Accessible Colour Design Tips
- Rather than relying solely on colour-coded legends, place labels directly on chart elements (bars, lines, or pie slices). This reduces cognitive load and helps users quickly identify what each element represents without needing to match colours. For example, label each line with the series name instead of using a colour legend.
- Use shapes (circles, squares, triangles) or line styles (solid, dashed, dotted) to differentiate data series, especially in line charts or scatter plots. Patterns such as stripes or dots on bars can help colourblind users distinguish between categories in bar charts.
- Select colours that differ significantly in luminance (brightness) and not just hue. Colours with different brightness levels can still be distinguished by colourblind users even if the hues look similar.
- To make things easier for yourself, use pre-built accessible colour palettes such as Tableau’s accessible palettes, or Power BI’s accessibility themes that are explicitly designed to be colour-blind friendly.
- The following websites can also help you generate more accessible colour schemes:
Tips and Resources for Testing Colour Accessibility
- Contrast ratio defines the difference between foreground and background colours. The Web Content Accessibility Guidelines (WCAG) recommend a minimum contrast ratio of 4.5:1 for normal text and 3:1 for larger text. Tools like the WebAIM Contrast Checker and Studio Noel’s Accessibility Colour Checker can help verify your colour choices.
- It may be useful (and interesting!) to view your visualisations in greyscale to check if the data can still be distinguished by differences in brightness. A well-designed dashboard should still convey meaning without relying on colour hue alone.
- Whenever possible, validate your dashboard with actual users, including those with colour vision deficiencies. Collect feedback on ease of interpreting key visual elements and adjust palette and design accordingly.