Skip to main content

On-demand webinar coming soon...

On-demand webinar coming soon...

On-demand webinar coming soon...

Charts & graphs

We have two types of charts and graphs—functional and expressive—to convey information. Both use our stepped color system.

Step gradient on a green background

Chart styles

When choosing which style of graph to use, ask yourself if the key idea is fact-driven e.g., “a 64% decrease”, or idea-driven e.g., “increased efficiency”.

Functional graphs

Functional graphs prioritize accuracy and facts. These are what you’d see on dashboards, in a presentation or an annual report.

Example use of functional graphs that accent data and important facts.
Illustration of step gradients used to make a bar graph
Line graphs with different colors

Expressive graphs

Expressive graphs are about conveying an idea, playing with shape and form much like a graphic element would. These work best with broad headlines and concepts, such as growth or change.

Example of using a step gradient on a document with text.
A step gradient inside a right triangle on with text

Color use

Our broad color palette helps to clearly delineate information, and step gradients convey density and growth.

White paper page showing a good use of step gradients to simulate density and relation between data.
Step gradient with green and blue colors.

Light green step gradient
White paper page using colors to simulate depth in a circle chart.
Step gradient with three rows of color
Step gradient with three hues of green