Color ramp

Many integrated color ramps prepared by our cartographers are ready to use.


To manually create a new color ramp that can be used with any of the weather layers, you must provide a color stop definition as follows:

Note that all the values of the color stops are in the actual unit of the layer (In the example °C) and the colors are in [R, G, B, A].


Options to provide to the constructor (ColorRampOptions)


The value the colorramp starts
The value the colorramp ends
Some color stops to copy from


Builtin color ramps

There are many builtin color ramps that are ready to be used. since most of them are defined in the interval [0, 1], they need to be scaled acording to their intended usage. Let’s see how to do this:

Color blindness

Because some forms of color blindness can affect up to 8% of the population, we thought it was fair that our library includes some perceptually uniform color ramps that are more color blind friendly.

The description from TypeScript auto completion will let you know about this information, otherwise, look for the ramps based on one of the following:

  • Mako
  • Turbo
  • Rocket
  • Cividis

See all the builtin color ramps:

The Weather JS module can only be used with the MapTiler SDK.