Class: Color
An RGBA color.
Each color component is a floating point value in the range 0 to 1. The r (red), g (green)
and b (blue) components define a color in RGB color space. The a (alpha) component defines
transparency. An alpha of 1 is fully opaque. An alpha of 0 is fully transparent.
Constructors
new Color()
new Color(
r?: number | number[],
g?: number,
b?: number,
a?: number): Color
Create a new Color object.
Parameters
r?
The value of the red component (0-1). Defaults to 0. If r is an array of length 3 or 4, the array will be used to populate all components.
number | number
g?
number = 0
The value of the green component (0-1). Defaults to 0.
b?
number = 0
The value of the blue component (0-1). Defaults to 0.
a?
number = 1
The value of the alpha component (0-1). Defaults to 1.
Returns
Properties
a
a: number
The alpha component of the color.
b
b: number
The blue component of the color.
g
g: number
The green component of the color.
r
r: number
The red component of the color.
BLACK
readonly static BLACK: Color;
A constant color set to black 0, 0, 0, 1.
BLUE
readonly static BLUE: Color;
A constant color set to blue 0, 0, 1, 1.
CYAN
readonly static CYAN: Color;
A constant color set to cyan 0, 1, 1, 1.
GRAY
readonly static GRAY: Color;
A constant color set to gray 0.5, 0.5, 0.5, 1.
GREEN
readonly static GREEN: Color;
A constant color set to green 0, 1, 0, 1.
MAGENTA
readonly static MAGENTA: Color;
A constant color set to magenta 1, 0, 1, 1.
RED
readonly static RED: Color;
A constant color set to red 1, 0, 0, 1.
WHITE
readonly static WHITE: Color;
A constant color set to white 1, 1, 1, 1.
YELLOW
readonly static YELLOW: Color;
A constant color set to yellow 1, 1, 0, 1.
Methods
clone()
clone(): Color
Returns a clone of the specified color.
Returns
A duplicate color object.
copy()
copy(rhs: Color): Color
Copies the contents of a source color to a destination color.
Parameters
rhs
A color to copy to the specified color.
Returns
Self for chaining.
Example
const src = new Color(1, 0, 0, 1)
const dst = new Color()
dst.copy(src)
console.log('The two colors are ' + (dst.equals(src) ? 'equal' : 'different'))
equals()
equals(rhs: Color): boolean
Reports whether two colors are equal.
Parameters
rhs
The color to compare to the specified color.
Returns
boolean
True if the colors are equal and false otherwise.
Example
const a = new Color(1, 0, 0, 1)
const b = new Color(1, 1, 0, 1)
console.log('The two colors are ' + (a.equals(b) ? 'equal' : 'different'))
fromArray()
fromArray(arr: number[], offset?: number): Color
Set the values of the vector from an array.
Parameters
arr
number
The array to set the vector values from.
offset?
number = 0
The zero-based index at which to start copying elements from the array. Default is 0.
Returns
Self for chaining.
Example
const c = new Color()
c.fromArray([
1,
0,
1,
1
])
// c is set to [1, 0, 1, 1]
fromString()
fromString(hex: string): Color
Set the values of the color from a string representation '#11223344' or '#112233'.
Parameters
hex
string
A string representation in the format '#RRGGBBAA' or '#RRGGBB'. Where RR, GG, BB, AA are red, green, blue and alpha values. This is the same format used in HTML/CSS.
Returns
Self for chaining.
gamma()
gamma(src?: Color): Color
Converts the color from linear to gamma color space.
Parameters
src?
Color = ...
The color to convert to gamma color space. If not set, the operation is done in place.
Returns
Self for chaining.
lerp()
lerp(
lhs: Color,
rhs: Color,
alpha: number): Color
Returns the result of a linear interpolation between two specified colors.
Parameters
lhs
The color to interpolate from.
rhs
The color to interpolate to.
alpha
number
The value controlling the point of interpolation. Between 0 and 1, the linear interpolant will occur on a straight line between lhs and rhs. Outside of this range, the linear interpolant will occur on a ray extrapolated from this line.
Returns
Self for chaining.
Example
const a = new Color(0, 0, 0)
const b = new Color(1, 1, 0.5)
const r = new Color()
r.lerp(a, b, 0) // r is equal to a
r.lerp(a, b, 0.5) // r is 0.5, 0.5, 0.25
r.lerp(a, b, 1) // r is equal to b
linear()
linear(src?: Color): Color
Converts the color from gamma to linear color space.
Parameters
src?
Color = ...
The color to convert to linear color space. If not set, the operation is done in place.
Returns
Self for chaining.
mulScalar()
mulScalar(scalar: number): Color
Multiplies RGB elements of a Color by a number. Note that the alpha value is left unchanged.
Parameters
scalar
number
The number to multiply by.
Returns
Self for chaining.
set()
set(
r: number,
g: number,
b: number,
a?: number): Color
Assign values to the color components, including alpha.
Parameters
r
number
The value for red (0-1).
g
number
The value for blue (0-1).
b
number
The value for green (0-1).
a?
number = 1
The value for the alpha (0-1), defaults to 1.
Returns
Self for chaining.
toArray()
toArray(
arr?: number[],
offset?: number,
alpha?: boolean): number[]
Converts the color to an array of numbers.
Parameters
arr?
number = []
The array to populate with the color components. If not specified, a new array is created. Default is true.
offset?
number = 0
The zero-based index at which to start copying elements to the array. Default is 0.
alpha?
boolean = true
If true, the output array will include the alpha value.
Returns
number
The color as an array of numbers.
Example
const c = new Color(1, 1, 1)
// Outputs [1, 1, 1, 1]
console.log(c.toArray())
toString()
toString(alpha: boolean, asArray?: boolean): string
Converts the color to string form. The format is '#RRGGBBAA', where RR, GG, BB, AA are the red, green, blue and alpha values. When the alpha value is not included (the default), this is the same format as used in HTML/CSS.
Parameters
alpha
boolean
If true, the output string will include the alpha value.
asArray?
boolean
If true, the output will be an array of numbers. Defaults to false.
Returns
string
The color in string form.
Example
const c = new Color(1, 1, 1)
// Outputs #ffffffff
console.log(c.toString())