Data-Driven Color Choicesfor Charts

Data-driven color choices for charts2

Can color improve the usability of my charts?

Data-driven color choices for charts3

Categorical or Qualitative

Sequential

Diverging (Two sequentials)

Palettes by Stephen Few

Data-driven color choices for charts4

Qualitative Color Palette

In a qualitative color palette, each color is used to identify a specific type of data.

Dribbble user Radium

Data-driven color choices for charts5

Sequential Color Palette

In sequential color palettes, a single hue intensifies to represent fixed incremental changes.

Dribbble user Vladesign

Data-driven color choices for charts6

Diverging Color Palette

Diverging color palettes feature two colors that grow in intensity, away from each other.

Dribbble user Ben Garratt

Data-driven color choices for charts7

Perceptual Uniformity

Color palettes have fixed ratios which add a layer of analogy to your data, something your viewers value.

Proof by Kenneth Moreland @Sandia

Data-driven color choices for charts8

Color Palette Tools for Making Charts

Color Brewer Generate and evaluate palette effectiveness

Color Gradient Finding saturation level values to use

Adobe Kuler

Try, create, and save various color schemes

Data-driven color choices for charts9

Color with Interactive Charts

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.

Data-driven color choices for charts10

Important Questions to Ask When Implementing Colors

• 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?

Data-driven color choices for charts11

More on Color

Read Morehttp://www.zingchart.com/blog/2014/08/25/color-charts/

Try it out your colorshttp://www.zingchart.com/try