1. Data-Driven Color Choices
for Charts

2. Can color improve the usability of my
charts?
Data-driven color choices for charts2

3. Data-driven color choices for charts3
Categorical or Qualitative
Sequential
Diverging (Two sequentials)
Palettes by Stephen Few

4. Qualitative Color Palette
Data-driven color choices for charts4
In a qualitative
color palette,
each color is
used to identify
a specific type
of data.
Dribbble user Radium

5. Sequential Color Palette
Data-driven color choices for charts5
In sequential
color palettes, a
single hue
intensifies to
represent fixed
incremental
changes.
Dribbble user Vladesign

6. Diverging Color Palette
Data-driven color choices for charts6
Diverging color
palettes feature
two colors that
grow in intensity,
away from each
other.
Dribbble user Ben Garratt

7. Perceptual Uniformity
Data-driven color choices for charts7
Color palettes have fixed ratios which
add a layer of analogy to your data,
something your viewers value.
Proof by Kenneth Moreland @Sandia

8. Color Palette Tools for Making Charts
Data-driven color choices for charts8
Color Brewer
Generate and evaluate palette effectiveness
Color Gradient
Finding saturation level values to use
Adobe Kuler
Try, create, and save various color schemes

9. Color with Interactive Charts
Data-driven color choices for charts9
Line: #96FEEF
Node: #A5B6B1
Bars: #6597A2
Tooltip: #54ced4
Consider the saturation of
your palette with hover
effects.
Consider the alpha (opacity)
level of your tooltips when
they are large.

10. Important Questions to Ask When
Implementing Colors
Data-driven color choices for charts10
• Which palette type best fits your data’s dimensions?
• Which colors will you use within the palette?
• Can saturation be used without disrupting
concentration?
• Will alpha or transparency help show off chart
elements?

11. More on Color
Data-driven color choices for charts11
Read More
http://www.zingchart.com/blog/2014/08/25/color-
charts/
Try it out your colors
http://www.zingchart.com/try