# Color Functions

▸ to-rgba() (opens new window)

Returns a four-element array containing the input color's red, green, blue, and alpha components, in that order.

▸ rgb() (opens new window)

Creates a color value from red, green, and blue components, which must range between 0 and 255, and an alpha component of 1. If any component is out of range, the expression is an error.

Creates a color value from red, green, blue components, which must range between 0 and 255, and an alpha component which must range between 0 and 1. If any component is out of range, the expression is an error.

# ▸ from-palette()

Selects a color from a 5-color palette. The color is determined by interpolation using the supplied value and the palette colors.

# Simple form

from-palette(paletteId: string, value: number, min: number, max: number, reverse?: boolean)

The returned color is determined by interpolation between the specified min and max values. An input value equal to min will return the first palette color. A input value equal to max will return the last palette color. Values in between min and max will be interpolated linearly using the full range of palette colors.

# Expanded form

from-palette(paletteId, value: number, stop1: number, stop2: number, stop3: number, stop4: number, stop5: number, reverse?: boolean)

The returned color is determined by interpolation using the specified color stops corresponding to the five colors of a palette. An input value between two color stops will be interpolated smoothly between the two corresponding colors. Specifying all five color stops is useful for mapping a non-linear distribution of values to the full range of palette colors.

# Parameters

Name	Type	Description
`paletteId`	String	ID of palette from PaletteRegistry.
`value`	Number	Value to use for interpolation.
`min`	Number	Minimum value for interpolation.
`max`	Number	Maximum value for interpolation.
`stopN`	Number	Value to assign to color stop N.
`reverse`	Boolean	Reverse the palette.

All numeric parameters can be reactive expressions.

See PaletteRegistry.register() for details of how to register a custom palette.

# Examples

<!--
  Set color from RdGnBlu palette by interpolating feature property `prop`
  between 0 and 100. Low values will be red and high values will be green.
-->
<flow-map-layer type="circle" ...>
  circle-color: from-palette('RdYlGn', @prop, 0, 100);
</flow-map-layer>

<!--
  Set color from RdGnBlu palette by interpolating feature property `prop`
  using color stops. Low values will be green and high values will be red.
-->
<flow-map-layer type="circle" ...>
  circle-color: from-palette('RdYlGn', @prop, 0, 5, 10, 50, 200, true);
</flow-map-layer>

<!--
  Set color from RdGnBlu palette by using a logarithmic scale.
-->
<flow-map-layer type="circle" ...>
  circle-color: from-palette('RdYlGn', log10(@prop), 0, 10);
</flow-map-layer>

← Overview Decision Functions →