Great Data Visualization Color Palette Examples to Use

The color palettes that users choose for a website or a brand are very important. Usually, this decision is made lightly, but this is a mistake.

Colors convey emotions and give a distinctive look to a brand. It turns out that colors are important to such an extent that they have a direct influence on purchase patterns.

Data visualization is not the exception. Some may spend hours on technical tasks, analysis, and preparing results only to struggle with how they look on the charts.

If you want your charts to be perfectly understandable, you must find the right combination of aesthetics and information. The proper color palettes can help convey the right message through graphics. However, a poor choice of color can conceal the necessary data and create confusion.

So, how can someone choose a data visualization color palette that helps graphics instead of ruining them? This article features different palettes that are commonly used for this purpose. This article also presents some tools to find the appropriate colors for your charts.

Defining Color Palettes

Every time someone presents positive results in the form of a chart, the information needs to be supported with colors. This is easy to see in everyday life.

When people watch the weather report on TV, they see that colder areas are highlighted with blue. In the same way, people recognize the warmer regions because they are painted in yellow. This wouldn’t work with different colors. Thus a clear example of how colors can support information or even distract.

But what exactly is a color palette?  The HSL model explains this concept. According to this theory, color has three characteristics:

• Hue
• Saturation
• Luminance

Hue

This is commonly known as a ‘color’ (blue, orange, green, yellow, etc.). Each of these hues is organized in what is known as a color wheel from 0° to 359°.

Saturation

Saturation refers to the color intensity. An intensity of 0% equals the color grey As the percentage of color increases so does the color’s brightness. Thus, highly saturated colors will look more vivid.

Luminance

Luminance is the parameter by which a color’s darkness is measured. As black is added to a certain color its luminance decreases.

Having established these three channels you can now understand data visualization color palettes better.

Choosing an Optimal Data Visualization Color Palette for your Charts

Chart created with wpDataTables

First, here is an explanation of the three principles of color palettes for data visualization purposes:

Brand recognition: Readers must recognize the brand. For this, choose color palettes that match the company’s identity.

Legibility: You want your audience to understand the information quickly and easily. For this, you need contrast. Choosing contrasting colors helps to distinguish different data units.

Meaning: As discussed at the beginning of this article, color palettes convey a message. If your data relates to political parties, for example, you can use the colors that distinguish them. When featuring degrees of something you want to use different color shades. Thus, the lower numbers can have a lighter shade and the highest numbers can be presented in darker colors.

Now, this article will discuss color palette types. Learning how to use color palettes is a profession in and of itself. However, it’s possible to set out some guidelines so that your data visualizations look their best.

Color Palette Types

Chart created with wpDataTables

The colors used for data visualization can be classified into three palettes: categorical colors, sequential colors, and diverging colors.

Categorical colors

When you want to present categories that are not correlated, go for a categorical color palette. This will make your categories perfectly distinguishable from each other.

Categorical colors must be displayed in sequence and contrast with one another. The maximum amount of colors is 10 and they must have different hues and saturation levels.

If you use more than 10 colors, the information will be hard to comprehend. Likewise, the closer colors are in hue and saturation, the harder it is to distinguish them.

Here are some examples that you can use:

Retro Metro

[“#ea5545”, “#f46a9b”, “#ef9b20”, “#edbf33”, “#ede15b”, “#bdcf32”, “#87bc45”, “#27aeef”, “#b33dc6”]

Dutch Field

[#e60049″, “#0bb4ff”, “#50e991”, “#e6d800”, “#9b19f5”, “#ffa300”, “#dc0ab4”, “#b3d4ff”, “#00bfa0”]

River Nights

[“#b30000”, “#7c1158”, “#4421af”, “#1a53ff”, “#0d88e6”, “#00b7c7”, “#5ad45a”, “#8be04e”, “#ebdc78”]

Spring Pastels

[“#fd7f6f”, “#7eb0d5”, “#b2e061”, “#bd7ebe”, “#ffb55a”, “#ffee65”, “#beb9db”, “#fdcce5”, “#8bd3c7”]

Sequential palettes

Use a sequential color palette for graphics with sequentially ordered values. Thus, sequential colors are displayed in a continuous pattern based on hue, lightness, or both. Each sequential color will be assigned to data values with higher values having lighter or darker shades.

Being the ideal option for trend charts, sequential palettes will help you highlight the evolution of a certain parameter. In a dark theme, the lighter colors represent the highest values. If you are working with a light theme, the darker colors will represent the highest values. Thus, with the second example, you have a light to dark palette.

Such an approach will help you draw the reader’s attention to the larger values.

Here are some excellent sequential color palette examples you can use:

Blue to Yellow

[“#115f9a”, “#1984c5”, “#22a7f0”, “#48b5c4”, “#76c68f”, “#a6d75b”, “#c9e52f”, “#d0ee11”, “#f4f100”]

Grey to Red

[“#d7e1ee”, “#cbd6e4”, “#bfcbdb”, “#b3bfd1”, “#a4a2a8”, “#df8879”, “#c86558”, “#b04238”, “#991f17”]

Black to Pink

[“#2e2b28”, “#3b3734”, “#474440”, “#54504c”, “#6b506b”, “#ab3da9”, “#de25da”, “#eb44e8”, “#ff80ff”]

Blues

[“#0000b3”, “#0010d9”, “#0020ff”, “#0040ff”, “#0060ff”, “#0080ff”, “#009fff”, “#00bfff”, “#00ffff”]

 

Diverging palettes

If your data visualization chart has a central value (let’s say ‘0’), diverging palettes will be useful.

This is a combination of two sequential palettes that share the same endpoint. As a result, readers will easily distinguish different values falling from different sides of the endpoint.

In the center of the graphic, it’s recommended to use a neutral color. Thus, your higher values will be properly highlighted towards the chart’s edges.

Here are some examples of how to use diverging colors:

Blue to Red

[“#1984c5”, “#22a7f0”, “#63bff0”, “#a7d5ed”, “#e2e2e2”, “#e1a692”, “#de6e56”, “#e14b31”, “#c23728”]

Orange to Purple

[“#ffb400”, “#d2980d”, “#a57c1b”, “#786028”, “#363445”, “#48446e”, “#5e569b”, “#776bcd”, “#9080ff”]

Pink Foam

[“#54bebe”, “#76c8c8”, “#98d1d1”, “#badbdb”, “#dedad2”, “#e4bcad”, “#df979e”, “#d7658b”, “#c80064”]

Salmon to Aqua

[“#e27c7c”, “#a86464”, “#6d4b4b”, “#503f3f”, “#333333”, “#3c4e4b”, “#466964”, “#599e94”, “#6cd4c5”]

Color Palette Generators

Now, what happens when you are working on large projects? In this case, it’s vital that your data visualization color palettes are consistent across all graphics, reports, documents, etc.

Luckily, there are color codes to reproduce the exact color with the right hue, saturation, and luminance.

For scientific publications, HEX color codes are very popular. These codes consist of 6 digits and can be used across websites, Google Slides, Excel, Adobe Illustrator, PowerPoint, and Prism. Other graphic design tools or platforms may use codes like CMYK, HSL, or RGB.

If you want to find different codes, the following tools will be of great help:

Toptal Color Platte

Use it to download HEX codes for a variety of color palettes including analogic, monochromatic, and custom palettes.

Google Color Picker

With this great tool you can use a slide to find the right codes. These can be of any kind (HEX, HSL, CMYK, or RGB).

Image Color Picker

Thanks to Image Color Picker you can pick colors from an uploaded picture or a URL. It allows you to extract HSL, HEX, and RGB codes.

Data Visualization Color Palette Resources

There are plenty of resources available online. With the appropriate software, you can choose the most convenient color palettes and highlight your data visualization work.

To help you, here is a list of color palettes that you can use for your “R” variable.

Also, take a look at the following resources:

Colormind

Color Hunt

Color Space

Coolors

Viz Palette

Data Color Picker

Canva Color palettes

Color Palette Helper

Color Palettes

Final Thoughts on How to Choose the Right Data Visualization Color Palette

The work of a data analyzer is not over when the technical tasks are fulfilled. When it comes to laying the information out for the readers, there are important decisions to make.

It doesn’t matter how accurate your information is or how thorough your research was, it will be worthless if people can’t read it. Moreover, they must be able to read it fast and correctly.

For this, choosing the right data visualization color palette is imperative. Depending on the type of graphic, you can choose from diverging palettes, sequential palettes, and categorical colors. If you want the shades to match across all graphics, use the appropriate color codes and find them through specific tools.

Finally, don’t forget the basics of color combination and its characteristics. With the information in this article, you are ready to create complex charts of the highest quality.

If you liked this article about data visualization color palettes, you should check out this article about open source data visualization.

There are also similar articles discussing data visualization javascript libraries, WordPress data visualization, interactive data visualization, and misleading data visualization examples.

And let’s not forget about articles on data visualization tools, data visualization best practices, data visualization examples, and weather data visualization.