All four charts below use the same data but different color palettes. Compare how the choice of colors affects readability and meaning. The data represents pageviews for six pages on a site.
The built-in Chart.js color cycle. These colors are designed to be visually distinct, but they carry no semantic meaning and may not meet accessibility standards.
A single-hue sequential palette. Best for ordered data (e.g., low-to-high rankings, time progression). Light shades represent low values; dark shades represent high values. The bars are sorted by value to reinforce the sequence.
Maximally distinct hues for nominal categories. No color implies “more” or “less” — each bar is simply a different category. Good for bar charts with unrelated categories.
Derived from the ColorBrewer qualitative palette, designed to be distinguishable by people with the most common forms of color vision deficiency (deuteranopia, protanopia). If your dashboard will be viewed by a broad audience, use palettes like this.