This module provides sequential, diverging and categorical color schemes derived from Cynthia A. Brewer’s ColorBrewer. Since ColorBrewer publishes only discrete color schemes, the sequential and diverging scales are interpolated using uniform B-splines. These schemes and interpolators are designed to work with d3-scale’s d3.scaleOrdinal and d3.scaleSequential.

For example, to create a categorical color scale using the Accent color scheme:

var accent = d3.scaleOrdinal(d3.schemeAccent);

To create a sequential discrete nine-color scale using the Blues color scheme:

var blues = d3.scaleOrdinal(d3.schemeBlues[9]);

To create a diverging, continuous color scale using the PiYG color scheme:

var piyg = d3.scaleSequential(d3.interpolatePiYG);

If you use NPM, `npm install d3-scale-chromatic`

. Otherwise, download the latest release or load directly from d3js.org as a standalone library. AMD, CommonJS, and vanilla environments are supported. In vanilla, a `d3`

global is exported:

<script src="https://d3js.org/d3-color.v1.min.js"></script> <script src="https://d3js.org/d3-interpolate.v1.min.js"></script> <script src="https://d3js.org/d3-scale-chromatic.v1.min.js"></script> <script> var yellow = d3.interpolateYlGn(0), // "rgb(255, 255, 229)" yellowGreen = d3.interpolateYlGn(0.5), // "rgb(120, 197, 120)" green = d3.interpolateYlGn(1); // "rgb(0, 69, 41)" </script>

Or, in combination with the D3 default bundle:

<script src="https://d3js.org/d3.v4.min.js"></script> <script src="https://d3js.org/d3-scale-chromatic.v1.min.js"></script> <script> var yellow = d3.interpolateYlGn(0), // "rgb(255, 255, 229)" yellowGreen = d3.interpolateYlGn(0.5), // "rgb(120, 197, 120)" green = d3.interpolateYlGn(1); // "rgb(0, 69, 41)" </script>

Try d3-scale-chromatic in your browser.

An array of eight categorical colors represented as RGB hexadecimal strings.

An array of eight categorical colors represented as RGB hexadecimal strings.

An array of twelve categorical colors represented as RGB hexadecimal strings.

An array of nine categorical colors represented as RGB hexadecimal strings.

An array of eight categorical colors represented as RGB hexadecimal strings.

An array of nine categorical colors represented as RGB hexadecimal strings.

An array of eight categorical colors represented as RGB hexadecimal strings.

An array of twelve categorical colors represented as RGB hexadecimal strings.

Diverging color schemes are available as continuous interpolators (often used with d3.scaleSequential) and as discrete schemes (often used with d3.scaleOrdinal). Each discrete scheme, such as d3.schemeBrBG, is represented as an array of arrays of hexadecimal color strings. The *k*th element of this array contains the color scheme of size *k*; for example, `d3.schemeBrBG[9]`

contains an array of nine strings representing the nine colors of the brown-blue-green diverging color scheme. Diverging color schemes support a size *k* ranging from 3 to 11.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “BrBG” diverging color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “PRGn” diverging color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “PiYG” diverging color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “PuOr” diverging color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “RdBu” diverging color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “RdGy” diverging color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “RdYlBu” diverging color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “RdYlGn” diverging color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “Spectral” diverging color scheme represented as an RGB string.

Sequential, single-hue color schemes are available as continuous interpolators (often used with d3.scaleSequential) and as discrete schemes (often used with d3.scaleOrdinal). Each discrete scheme, such as d3.schemeBlues, is represented as an array of arrays of hexadecimal color strings. The *k*th element of this array contains the color scheme of size *k*; for example, `d3.schemeBlues[9]`

contains an array of nine strings representing the nine colors of the blue sequential color scheme. Sequential, single-hue color schemes support a size *k* ranging from 3 to 9.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “Blues” sequential color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “Greens” sequential color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “Greys” sequential color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “Oranges” sequential color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “Purples” sequential color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “Reds” sequential color scheme represented as an RGB string.

Sequential, multi-hue color schemes are available as continuous interpolators (often used with d3.scaleSequential) and as discrete schemes (often used with d3.scaleOrdinal). Each discrete scheme, such as d3.schemeBuGn, is represented as an array of arrays of hexadecimal color strings. The *k*th element of this array contains the color scheme of size *k*; for example, `d3.schemeBuGn[9]`

contains an array of nine strings representing the nine colors of the blue-green sequential color scheme. Sequential, multi-hue color schemes support a size *k* ranging from 3 to 9.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “BuGn” sequential color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “BuPu” sequential color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “GnBu” sequential color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “OrRd” sequential color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “PuBuGn” sequential color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “PuBu” sequential color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “PuRd” sequential color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “RdPu” sequential color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “YlGnBu” sequential color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “YlGn” sequential color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “YlOrBr” sequential color scheme represented as an RGB string.

d3.

Given a number *t* in the range [0,1], returns the corresponding color from the “YlOrRd” sequential color scheme represented as an RGB string.

© 2010–2017 Michael Bostock

Licensed under the BSD License.

https://github.com/d3/d3-scale-chromatic