askvity

How to Use Color in a Chart

Published in Color in Data Visualization 4 mins read

Using color effectively in charts helps visually encode data, guide attention, and improve understanding.

Color is a powerful tool in data visualization, used primarily to represent different data points or categories and to add emphasis. The way you apply color depends heavily on the type of data you are working with and the message you want to convey.

Mapping Data Types to Color

Choosing the right color scheme involves understanding whether your data is categorical or quantitative.

Categorical Data

For data representing distinct categories with no inherent order (like product types, countries, or departments), use separate, easily distinguishable hues.

  • Goal: Differentiate items visually.
  • Method: Assign a unique color (e.g., blue, red, green) to each category.
  • Tip: Limit the number of colors used to avoid overwhelming the viewer; generally, keep it under 7-10 distinct colors.

Quantitative Data (Sequential and Divergent)

When representing numerical values or ordered data, color intensity or a gradient of colors is typically used to show magnitude or relative differences.

Sequential Data

For data that ranges from low to high values along a single dimension (like temperature, income level, or time), use a gradient of color that changes in lightness or saturation.

  • Goal: Show a range of values from low to high.

  • Method: Transition from one color or shade to another.

  • Principle: Typically, lower values are associated with lighter colors, and higher values with darker colors. This is because plots tend to be on white or similarly light backgrounds.

  • Important Consideration (from reference): On a dark background, it's common to have the reverse case, where higher values are indicated with brighter, lighter colors. The key is using contrast effectively relative to the background.

  • Example: A heat map showing population density might use lighter blues for low density and darker blues for high density on a white background. On a dark background, high density might be shown with bright yellow or white.

Divergent Data

For data that has a meaningful mid-point (like a zero point, an average, or a survey neutral point) and values diverge in two directions (e.g., positive vs. negative, above vs. below average), use two different hues that diverge from a neutral color at the midpoint.

  • Goal: Show deviation from a central value.
  • Method: Use two distinct hues (e.g., red and blue) that become more saturated or darker as values move further from the center in either direction, often with a neutral color (like grey or white) at the midpoint.
  • Example: A chart showing profit/loss might use shades of blue for profit (darker blue for higher profit) and shades of red for loss (darker red for greater loss), meeting at white or grey for zero profit/loss.

Best Practices for Effective Color Use

  • Consider Accessibility: Use color combinations that are distinguishable by individuals with color vision deficiencies. Avoid using only red and green together to encode critical differences. Ensure sufficient contrast between colors and the background.
  • Be Consistent: Use the same color to represent the same category or range of values across multiple charts within a report or dashboard.
  • Avoid Overuse: Too many colors can be distracting and make the chart difficult to interpret. Use color purposefully to highlight key information.
  • Always Add Legends: Provide a color legend to explain what each color represents, especially when using gradients or multiple categories.
  • Think About Background: As highlighted earlier, the background color influences how colors are perceived and how you might map sequential values (e.g., using lighter colors for higher values on dark backgrounds).

Here's a brief summary of data types and typical color encoding methods:

Data Type Color Property Used Example Use
Categorical Hue Different product categories
Sequential Lightness/Saturation Gradient Temperature range, population density
Divergent Hue/Lightness Gradient Profit/Loss, Survey Agreement

Using color thoughtfully transforms a chart from a simple display of data into a compelling visual story.

Related Articles