Color reference

Below are details on the different color palettes and scales that Kumu supports. Use these with the Color by tool in the Basic Editor, or use them in the Advanced Editor with the categorize() and scale() functions.

Named color scales

Kumu has built-in support for a number of named color scales, including all ColorBrewer scales.

Sequential and diverging

Both sequential and diverging color palettes are great when you are trying to show quantitative data or data that has a meaningful order.

Qualitative

Qualitative color palettes are best when you are trying to show data with discrete values that don't have an inherent order.

Here's an example of how to use a named color scale:

element {
  color: scale("net worth", bujumbra);
}

Inverting a color scale

Any color scale can be inverted by adding -inverted to the name.

Defining your own color palette

You can define your own color palette for elements by using a comma separated list of color values.

@settings {
  element-color: categorize("community", #5BC1AE, #009CDB, #F6882B, #8E278F);
}

For flags, the code is slightly different:

@settings {
  element-flag: "Tags" with #5BC1AE, #009CDB, #F6882B, #8E278F;
}

Setting explicit stops for color values in categorize()

It's also possible to specify which value should receive a certain color for elements.

@settings {
  element-color: categorize("element type", #5BC1AE "Person", #009CDB "Organization", #F6882B "Region");
}

For flags, the code is slightly different:

@settings {
  element-flag: "Tags" with #5BC1AE "Person", #009CDB "Organization", #F6882B "Region;
}