v5.20192.631
|

Color Class

Represents a color.

The Color class parses colors specified as CSS strings and exposes their red, green, blue, and alpha channels as read-write properties.

The Color class also provides fromHsb and fromHsl methods for creating colors using the HSB and HSL color models instead of RGB, as well as getHsb and getHsl methods for retrieving the color components using those color models.

Finally, the Color class provides an interpolate method that creates colors by interpolating between two colors using the HSL model. This method is especially useful for creating color animations with the animate method.

The example below shows how this works:

Example

Hierarchy

  • Color

Constructors

constructor

  • new Color(color: string): Color
  • Initializes a new Color from a CSS color specification.

    Parameters

    • color: string

      CSS color specification.

    Returns Color

Properties

a

a: number

Gets or sets the alpha component of this Color, in a range from 0 to 1 (zero is transparent, one is solid).

b

b: number

Gets or sets the blue component of this Color, in a range from 0 to 255.

g

g: number

Gets or sets the green component of this Color, in a range from 0 to 255.

r

r: number

Gets or sets the red component of this Color, in a range from 0 to 255.

Methods

equals

  • equals(clr: Color): boolean
  • Returns true if a Color has the same value as this Color.

    Parameters

    Returns boolean

getHsb

  • getHsb(): number[]
  • Gets an array with this color's HSB components.

    Returns number[]

getHsl

  • getHsl(): number[]
  • Gets an array with this color's HSL components.

    Returns number[]

toString

  • toString(): string
  • Gets a string representation of this Color.

    Returns string

Static fromHsb

  • fromHsb(h: number, s: number, b: number, a?: number): Color
  • Creates a new Color using the specified HSB values.

    Parameters

    • h: number

      Hue value, from 0 to 1.

    • s: number

      Saturation value, from 0 to 1.

    • b: number

      Brightness value, from 0 to 1.

    • Optional a: number

      Alpha value, from 0 to 1.

    Returns Color

Static fromHsl

  • fromHsl(h: number, s: number, l: number, a?: number): Color
  • Creates a new Color using the specified HSL values.

    Parameters

    • h: number

      Hue value, from 0 to 1.

    • s: number

      Saturation value, from 0 to 1.

    • l: number

      Lightness value, from 0 to 1.

    • Optional a: number

      Alpha value, from 0 to 1.

    Returns Color

Static fromRgba

  • fromRgba(r: number, g: number, b: number, a?: number): Color
  • Creates a new Color using the specified RGBA color channel values.

    Parameters

    • r: number

      Value for the red channel, from 0 to 255.

    • g: number

      Value for the green channel, from 0 to 255.

    • b: number

      Value for the blue channel, from 0 to 255.

    • Optional a: number

      Value for the alpha channel, from 0 to 1.

    Returns Color

Static fromString

  • fromString(value: string): Color
  • Creates a new Color from a CSS color string.

    Parameters

    • value: string

      String containing a CSS color specification.

    Returns Color

    A new Color, or null if the string cannot be parsed into a color.

Static interpolate

  • Creates a Color by interpolating between two colors.

    Parameters

    • c1: Color

      First color.

    • c2: Color

      Second color.

    • pct: number

      Value between zero and one that determines how close the interpolation should be to the second color.

    Returns Color

Static toOpaque

  • toOpaque(c: any, bkg?: any): Color
  • Gets the closest opaque color to a given color.

    Parameters

    • c: any

      Color to be converted to an opaque color (the color may also be specified as a string).

    • Optional bkg: any

      Background color to use when removing the transparency (defaults to white).

    Returns Color