Documentation

Color

Type class

Wherever color needs to be specified in amCharts 5, Color object needs to be used.

Click here for more info

Sources

Color can be used (imported) via one of the following packages.

// Import Color
import * as am5 from "@amcharts/amcharts5";

// Create Color
am5.Color.new(root, {
  // ... config if applicable
});

<!-- Load Color -->
<script src="index.js"></script>

<script>
// Create Color
am5.Color.new(root, {
  // ... config if applicable
});
</script>

Inheritance

Color does not extend any other symbol.

Color is not extended by any other symbol.

Settings

Color does not have any settings.

Private settings

Color does not have any private settings.

Properties

b
#

Type number

Value of color's B channel.
g
#

Type number

Value of color's G channel.
hex
#

Type number

Color numeric value.
r
#

Type number

Value of color's R channel.

Methods

alternative(

color: Color,
lightAlternative?: Color,
darkAlternative?: Color

)

#

Static

Returns Color

Returns a new Color object based on either lightAlternative or darkAlternative depending on which one is more contrasting with the color.

brighten(

color: Color,
percent: number

)

#

Static

Returns Color

Returns a new Color brightened by percent value.

Use negative value to dim the color.

fromAny(

s: string | number | Color

)

#

Static

Returns Color

Convert to color from virtually anything.

Will throw an exception if unable to resolve the color.

fromCSS(

s: string

)

#

Static

Returns Color

Converts CSS rgba() syntax to a new Color object.

Color.fromCSS("rgba(255, 0, 0, 1)") // red

Color.fromCSS("rgba(255, 0, 0, 1)") // red

fromHSL(

h: number,
s: number,
l: number

)

#

Static

Returns Color

Converts HSL values into a new Color object.

fromHex(

hex: number

)

#

Static

Returns Color

Converts hex number into a new Color object.

Color.fromHex(0xff0000) // red

Color.fromHex(0xff0000) // red

fromRGB(

r: number,
g: number,
b: number

)

#

Static

Returns Color

Converts RGB values to a new Color object.

fromString(

s: string

)

#

Static

Returns Color

Converts RGB string to a new Color object.

Color.fromString("#ff0000") // red

Color.fromString("#ff0000") // red

interpolate(

diff: Time,
from: Color,
to: Color,
mode: "rgb" | "hsl"

)

#

Static

Returns Color

Returns an intermediate Color between two reference colors depending on the progress (diff) between the two.

lighten(

color: Color,
percent: number

)

#

Static

Returns Color

Returns a new Color lightened by percent value.

Use negative value to darken the color.

saturate(

color: Color,
percent: number

)

#

Static

Returns Color

Returns a new Color saturated by percent value.

Value range is between 0 (fully desaturated), to 1 (full color).

toCSS(

alpha: number

)

#

Returns string

Returns color CSS representation in form of rgba(r, g, b, a) string.

toCSSHex()

#

Returns string

Returns color CSS representation in form of #rgb string.

toHSL(

alpha: number

)

#

Returns iHSL

Returns color's HSL info.

toString()

#

Returns string

Events

Color does not have any events.