# Class: Color

## Phaser. Color

#### new Color()

  The Phaser.Color class is a set of static methods that assist in color manipulation and conversion.

  Source:
    - utils/Color.js, line 3

### Methods

#### <static> colorToHexstring(color) → {string}

  DEPRECATED: This method will be removed in Phaser 2.1. Please use Phaser.Color.componentToHex instead. Return a string containing a hex representation of the given color.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `color` | number | The color channel to get the hex value for, must be a value between 0 and 255).

  Source:
    - utils/Color.js, line 931

  ##### Returns:

  A string of length 2 characters, i.e. 255 = FF, 0 = 00.

  Type
    string

#### <static> componentToHex(color) → {string}

  Return a string containing a hex representation of the given color component.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `color` | number | The color channel to get the hex value for, must be a value between 0 and 255.

  Source:
    - utils/Color.js, line 583

  ##### Returns:

  A string of length 2 characters, i.e. 255 = ff, 100 = 64.

  Type
    string

#### <static> createColor(r, g, b, a, h, s, l, v) → {object}

  A utility function to create a lightweight 'color' object with the default components. Any components that are not specified will default to zero.

  This is useful when you want to use a shared color object for the getPixel and getPixelAt methods.

  ##### Parameters:

  Name | Type | Argument | Default | Description
  --- | --- | --- | --- | ---
  `r` | number | <optional> | 0 | The red color component, in the range 0 - 255.
  `g` | number | <optional> | 0 | The green color component, in the range 0 - 255.
  `b` | number | <optional> | 0 | The blue color component, in the range 0 - 255.
  `a` | number | <optional> | 1 | The alpha color component, in the range 0 - 1.
  `h` | number | <optional> | 0 | The hue, in the range 0 - 1.
  `s` | number | <optional> | 0 | The saturation, in the range 0 - 1.
  `l` | number | <optional> | 0 | The lightness, in the range 0 - 1.
  `v` | number | <optional> | 0 | The value, in the range 0 - 1.

  Author:
    - Matt DesLauriers (@mattdesl)
  Source:
    - utils/Color.js, line 421

  ##### Returns:

  The resulting object with r, g, b, a properties and h, s, l and v.

  Type
    object

#### <static> fromRGBA(rgba, out) → {object}

  A utility to convert an integer in 0xRRGGBBAA format to a color object. This does not rely on endianness.

  ##### Parameters:

  Name | Type | Argument | Description
  --- | --- | --- | ---
  `rgba` | number |  | An RGBA hex
  `out` | object | <optional> | The object to use, optional.

  Author:
    - Matt DesLauriers (@mattdesl)
  Source:
    - utils/Color.js, line 97

  ##### Returns:

  A color object.

  Type
    object

#### <static> getAlpha(color) → {number}

  Given a native color value (in the format 0xAARRGGBB) this will return the Alpha component, as a value between 0 and 255.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `color` | number | In the format 0xAARRGGBB.

  Source:
    - utils/Color.js, line 811

  ##### Returns:

  The Alpha component of the color, will be between 0 and 1 (0 being no Alpha (opaque), 1 full Alpha (transparent)).

  Type
    number

#### <static> getAlphaFloat(color) → {number}

  Given a native color value (in the format 0xAARRGGBB) this will return the Alpha component as a value between 0 and 1.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `color` | number | In the format 0xAARRGGBB.

  Source:
    - utils/Color.js, line 823

  ##### Returns:

  The Alpha component of the color, will be between 0 and 1 (0 being no Alpha (opaque), 1 full Alpha (transparent)).

  Type
    number

#### <static> getBlue(color) → {number}

  Given a native color value (in the format 0xAARRGGBB) this will return the Blue component, as a value between 0 and 255.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `color` | number | In the format 0xAARRGGBB.

  Source:
    - utils/Color.js, line 859

  ##### Returns:

  The Blue component of the color, will be between 0 and 255 (0 being no color, 255 full Blue).

  Type
    number

#### <static> getColor(r, g, b) → {number}

  Given 3 color values this will return an integer representation of it.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `r` | number | The red color component, in the range 0 - 255.
  `g` | number | The green color component, in the range 0 - 255.
  `b` | number | The blue color component, in the range 0 - 255.

  Source:
    - utils/Color.js, line 483

  ##### Returns:

  A native color value integer (format: 0xRRGGBB).

  Type
    number

#### <static> getColor32(a, r, g, b) → {number}

  Given an alpha and 3 color values this will return an integer representation of it.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `a` | number | The alpha color component, in the range 0 - 255.
  `r` | number | The red color component, in the range 0 - 255.
  `g` | number | The green color component, in the range 0 - 255.
  `b` | number | The blue color component, in the range 0 - 255.

  Source:
    - utils/Color.js, line 466

  ##### Returns:

  A native color value integer (format: 0xAARRGGBB).

  Type
    number

#### <static> getColorInfo(color) → {string}

  DEPRECATED: This method will be removed in Phaser 2.1. Returns a string containing handy information about the given color including string hex value, RGB format information. Each section starts on a newline, 3 lines in total.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `color` | number | A color value in the format 0xAARRGGBB.

  Source:
    - utils/Color.js, line 873

  ##### Returns:

  String containing the 3 lines of information.

  Type
    string

#### <static> getGreen(color) → {number}

  Given a native color value (in the format 0xAARRGGBB) this will return the Green component, as a value between 0 and 255.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `color` | number | In the format 0xAARRGGBB.

  Source:
    - utils/Color.js, line 847

  ##### Returns:

  The Green component of the color, will be between 0 and 255 (0 being no color, 255 full Green).

  Type
    number

#### <static> getRandomColor(min, max, alpha) → {number}

  Returns a random color value between black and white Set the min value to start each channel from the given offset. Set the max value to restrict the maximum color used per channel.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `min` | number | The lowest value to use for the color.
  `max` | number | The highest value to use for the color.
  `alpha` | number | The alpha value of the returning color (default 255 = fully opaque).

  Source:
    - utils/Color.js, line 721

  ##### Returns:

  32-bit color value with alpha.

  Type
    number

#### <static> getRed(color) → {number}

  Given a native color value (in the format 0xAARRGGBB) this will return the Red component, as a value between 0 and 255.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `color` | number | In the format 0xAARRGGBB.

  Source:
    - utils/Color.js, line 835

  ##### Returns:

  The Red component of the color, will be between 0 and 255 (0 being no color, 255 full Red).

  Type
    number

#### <static> getRGB(color) → {object}

  Return the component parts of a color as an Object with the properties alpha, red, green, blue.

  Alpha will only be set if it exist in the given color (0xAARRGGBB)

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `color` | number | Color in RGB (0xRRGGBB) or ARGB format (0xAARRGGBB).

  Source:
    - utils/Color.js, line 753

  ##### Returns:

  An Object with properties: alpha, red, green, blue (also r, g, b and a). Alpha will only be present if a color value > 16777215 was given.

  Type
    object

#### <static> getWebRGB(color) → {string}

  Returns a CSS friendly string value from the given color.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `color` | number | Color in RGB (0xRRGGBB) or ARGB format (0xAARRGGBB).

  Source:
    - utils/Color.js, line 795

  ##### Returns:

  A string in the format: 'rgba(r,g,b,a)'

  Type
    string

#### <static> hexToColor(hex, out) → {object}

  Converts a hex string into a Phaser Color object.

  ##### Parameters:

  Name | Type | Argument | Description
  --- | --- | --- | ---
  `hex` | string |  | The hex string to convert. Can be in the short-hand format `#03f` or `#0033ff`.
  `out` | object | <optional> | An object into which 3 properties will be created: r, g and b. If not provided a new object will be created.

  Source:
    - utils/Color.js, line 547

  ##### Returns:

  An object with the red, green and blue values set in the r, g and b properties.

  Type
    object

#### <static> hexToRGB(hex) → {number}

  Converts a hex string into an integer color value.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `hex` | string | The hex string to convert. Can be in the short-hand format `#03f` or `#0033ff`.

  Source:
    - utils/Color.js, line 528

  ##### Returns:

  The rgb color value in the format 0xAARRGGBB.

  Type
    number

#### <static> HSLColorWheel(s, l) → {array}

  Get HSL color wheel values in an array which will be 360 elements in size.

  ##### Parameters:

  Name | Type | Argument | Default | Description
  --- | --- | --- | --- | ---
  `s` | number | <optional> | 0.5 | The saturation, in the range 0 - 1.
  `l` | number | <optional> | 0.5 | The lightness, in the range 0 - 1.

  Source:
    - utils/Color.js, line 623

  ##### Returns:

  An array containing 360 elements corresponding to the HSL color wheel.

  Type
    array

#### <static> HSLtoRGB(h, s, l, out) → {object}

  Converts an HSL (hue, saturation and lightness) color value to RGB. Conversion forumla from http://en.wikipedia.org/wiki/HSL_color_space. Assumes HSL values are contained in the set [0, 1] and returns r, g and b values in the set [0, 255]. Based on code by Michael Jackson (https://github.com/mjijackson)

  ##### Parameters:

  Name | Type | Argument | Description
  --- | --- | --- | ---
  `h` | number |  | The hue, in the range 0 - 1.
  `s` | number |  | The saturation, in the range 0 - 1.
  `l` | number |  | The lightness, in the range 0 - 1.
  `out` | object | <optional> | An object into which 3 properties will be created: r, g and b. If not provided a new object will be created.

  Source:
    - utils/Color.js, line 203

  ##### Returns:

  An object with the red, green and blue values set in the r, g and b properties.

  Type
    object

#### <static> HSVColorWheel(s, v) → {array}

  Get HSV color wheel values in an array which will be 360 elements in size.

  ##### Parameters:

  Name | Type | Argument | Default | Description
  --- | --- | --- | --- | ---
  `s` | number | <optional> | 1 | The saturation, in the range 0 - 1.
  `v` | number | <optional> | 1 | The value, in the range 0 - 1.

  Source:
    - utils/Color.js, line 598

  ##### Returns:

  An array containing 360 elements corresponding to the HSV color wheel.

  Type
    array

#### <static> HSVtoRGB(h, s, v, out) → {object}

  Converts an HSV (hue, saturation and value) color value to RGB. Conversion forumla from http://en.wikipedia.org/wiki/HSL_color_space. Assumes HSV values are contained in the set [0, 1] and returns r, g and b values in the set [0, 255]. Based on code by Michael Jackson (https://github.com/mjijackson)

  ##### Parameters:

  Name | Type | Argument | Description
  --- | --- | --- | ---
  `h` | number |  | The hue, in the range 0 - 1.
  `s` | number |  | The saturation, in the range 0 - 1.
  `v` | number |  | The value, in the range 0 - 1.
  `out` | object | <optional> | An object into which 3 properties will be created: r, g and b. If not provided a new object will be created.

  Source:
    - utils/Color.js, line 310

  ##### Returns:

  An object with the red, green and blue values set in the r, g and b properties.

  Type
    object

#### <static> hueToColor(p, q, t) → {number}

  Converts a hue to an RGB color. Based on code by Michael Jackson (https://github.com/mjijackson)

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `p` | number |
  `q` | number |
  `t` | number |

  Source:
    - utils/Color.js, line 379

  ##### Returns:

  The color component value.

  Type
    number

#### <static> interpolateColor(color1, color2, steps, currentStep, alpha) → {number}

  Interpolates the two given colours based on the supplied step and currentStep properties.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `color1` | number | The first color value.
  `color2` | number | The second color value.
  `steps` | number | The number of steps to run the interpolation over.
  `currentStep` | number | The currentStep value. If the interpolation will take 100 steps, a currentStep value of 50 would be half-way between the two.
  `alpha` | number | The alpha of the returned color.

  Source:
    - utils/Color.js, line 648

  ##### Returns:

  The interpolated color value.

  Type
    number

#### <static> interpolateColorWithRGB(color, r, g, b, steps, currentStep) → {number}

  Interpolates the two given colours based on the supplied step and currentStep properties.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `color` | number | The first color value.
  `r` | number | The red color value, between 0 and 0xFF (255).
  `g` | number | The green color value, between 0 and 0xFF (255).
  `b` | number | The blue color value, between 0 and 0xFF (255).
  `steps` | number | The number of steps to run the interpolation over.
  `currentStep` | number | The currentStep value. If the interpolation will take 100 steps, a currentStep value of 50 would be half-way between the two.

  Source:
    - utils/Color.js, line 674

  ##### Returns:

  The interpolated color value.

  Type
    number

#### <static> interpolateRGB(r1, g1, b1, r2, g2, b2, steps, currentStep) → {number}

  Interpolates the two given colours based on the supplied step and currentStep properties.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `r1` | number | The red color value, between 0 and 0xFF (255).
  `g1` | number | The green color value, between 0 and 0xFF (255).
  `b1` | number | The blue color value, between 0 and 0xFF (255).
  `r2` | number | The red color value, between 0 and 0xFF (255).
  `g2` | number | The green color value, between 0 and 0xFF (255).
  `b2` | number | The blue color value, between 0 and 0xFF (255).
  `steps` | number | The number of steps to run the interpolation over.
  `currentStep` | number | The currentStep value. If the interpolation will take 100 steps, a currentStep value of 50 would be half-way between the two.

  Source:
    - utils/Color.js, line 697

  ##### Returns:

  The interpolated color value.

  Type
    number

#### <static> packPixel(r, g, b, a) → {number}

  Packs the r, g, b, a components into a single integer, for use with Int32Array. If device is little endian then ABGR order is used. Otherwise RGBA order is used.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `r` | number | The red color component, in the range 0 - 255.
  `g` | number | The green color component, in the range 0 - 255.
  `b` | number | The blue color component, in the range 0 - 255.
  `a` | number | The alpha color component, in the range 0 - 255.

  Author:
    - Matt DesLauriers (@mattdesl)
  Source:
    - utils/Color.js, line 14

  ##### Returns:

  The packed color

  Type
    number

#### <static> RGBtoHexstring(color) → {string}

  DEPRECATED: This method will be removed in Phaser 2.1. Please use Phaser.Color.RGBtoString instead. Return a string representation of the color in the format 0xAARRGGBB.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `color` | number | The color to get the string representation for

  Source:
    - utils/Color.js, line 897

  ##### Returns:

  A string of length 10 characters in the format 0xAARRGGBB

  Type
    string

#### <static> RGBtoHSL(r, g, b, out) → {object}

  Converts an RGB color value to HSL (hue, saturation and lightness). Conversion forumla from http://en.wikipedia.org/wiki/HSL_color_space. Assumes RGB values are contained in the set [0, 255] and returns h, s and l in the set [0, 1]. Based on code by Michael Jackson (https://github.com/mjijackson)

  ##### Parameters:

  Name | Type | Argument | Description
  --- | --- | --- | ---
  `r` | number |  | The red color component, in the range 0 - 255.
  `g` | number |  | The green color component, in the range 0 - 255.
  `b` | number |  | The blue color component, in the range 0 - 255.
  `out` | object | <optional> | An object into which 3 properties will be created, h, s and l. If not provided a new object will be created.

  Source:
    - utils/Color.js, line 144

  ##### Returns:

  An object with the hue, saturation and lightness values set in the h, s and l properties.

  Type
    object

#### <static> RGBtoHSV(r, g, b, out) → {object}

  Converts an RGB color value to HSV (hue, saturation and value). Conversion forumla from http://en.wikipedia.org/wiki/HSL_color_space. Assumes RGB values are contained in the set [0, 255] and returns h, s and v in the set [0, 1]. Based on code by Michael Jackson (https://github.com/mjijackson)

  ##### Parameters:

  Name | Type | Argument | Description
  --- | --- | --- | ---
  `r` | number |  | The red color component, in the range 0 - 255.
  `g` | number |  | The green color component, in the range 0 - 255.
  `b` | number |  | The blue color component, in the range 0 - 255.
  `out` | object | <optional> | An object into which 3 properties will be created, h, s and v. If not provided a new object will be created.

  Source:
    - utils/Color.js, line 254

  ##### Returns:

  An object with the hue, saturation and value set in the h, s and v properties.

  Type
    object

#### <static> RGBtoString(r, g, b, a, prefix) → {string}

  Converts the given color values into a string. If prefix was '#' it will be in the format `#RRGGBB` otherwise `0xAARRGGBB`.

  ##### Parameters:

  Name | Type | Argument | Default | Description
  --- | --- | --- | --- | ---
  `r` | number |  |  | The red color component, in the range 0 - 255.
  `g` | number |  |  | The green color component, in the range 0 - 255.
  `b` | number |  |  | The blue color component, in the range 0 - 255.
  `a` | number | <optional> | 255 | The alpha color component, in the range 0 - 255.
  `prefix` | string | <optional> | '#' | The prefix used in the return string. If '#' it will return `#RRGGBB`, else `0xAARRGGBB`.

  Source:
    - utils/Color.js, line 499

  ##### Returns:

  A string containing the color values. If prefix was '#' it will be in the format `#RRGGBB` otherwise `0xAARRGGBB`.

  Type
    string

#### <static> RGBtoWebstring(color) → {string}

  DEPRECATED: This method will be removed in Phaser 2.1. Please use Phaser.Color.RGBtoString instead. Return a string representation of the color in the format #RRGGBB.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `color` | number | The color to get the string representation for.

  Source:
    - utils/Color.js, line 914

  ##### Returns:

  A string of length 10 characters in the format 0xAARRGGBB.

  Type
    string

#### <static> toRGBA(r, g, b, a) → {number}

  A utility to convert RGBA components to a 32 bit integer in RRGGBBAA format.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `r` | number | The red color component, in the range 0 - 255.
  `g` | number | The green color component, in the range 0 - 255.
  `b` | number | The blue color component, in the range 0 - 255.
  `a` | number | The alpha color component, in the range 0 - 255.

  Author:
    - Matt DesLauriers (@mattdesl)
  Source:
    - utils/Color.js, line 126

  ##### Returns:

  A RGBA-packed 32 bit integer

  Type
    number

#### <static> unpackPixel(rgba, out, hsl, hsv) → {object}

  Unpacks the r, g, b, a components into the specified color object, or a new object, for use with Int32Array. If little endian, then ABGR order is used when unpacking, otherwise, RGBA order is used. The resulting color object has the `r, g, b, a` properties which are unrelated to endianness.

  Note that the integer is assumed to be packed in the correct endianness. On little-endian the format is 0xAABBGGRR and on big-endian the format is 0xRRGGBBAA. If you want a endian-independent method, use fromRGBA(rgba) and toRGBA(r, g, b, a).

  ##### Parameters:

  Name | Type | Argument | Default | Description
  --- | --- | --- | --- | ---
  `rgba` | number |  |  | The integer, packed in endian order by packPixel.
  `out` | object | <optional> |  | An object into which 3 properties will be created: r, g and b. If not provided a new object will be created.
  `hsl` | boolean | <optional> | false | Also convert the rgb values into hsl?
  `hsv` | boolean | <optional> | false | Also convert the rgb values into hsv?

  Author:
    - Matt DesLauriers (@mattdesl)
  Source:
    - utils/Color.js, line 40

  ##### Returns:

  An object with the red, green and blue values set in the r, g and b properties.

  Type
    object

#### <static> updateColor(out) → {number}

  Takes a color object and updates the rgba property.

  ##### Parameters:

  Name | Type | Description
  --- | --- | ---
  `out` | object | The color object to update.

  Source:
    - utils/Color.js, line 450

  ##### Returns:

  A native color value integer (format: 0xAARRGGBB).

  Type
    number