Applying chart colours and textures

Using colours and textures effectively is key to communicating the chart content.

Colour palette

Our charts offer 30 distinct colours, 10 of which are highly accessible.

  • The colour contrast allows visually-impaired users to easily differentiate between them.
  • Greys are reserved for:
    • neutral values
    • identifying the target range in line charts

Credits: Name that Color JavaScript library by Chirag Mehta.


  • Dotted lines are reserved for projections in line charts.
  • Diagonal lines in bar and column charts are reserved for projections.
Dark Mode Beta
Dark Mode Beta