Color

Class representing a color.

Code Examples

A Color can be initialised in any of the following ways:

Constructor

Color(r : Color_Hex_or_String, g : Float, b : Float)

r - (optional) If arguments g and b are defined, the red component of the color. If they are not defined, it can be a hexadecimal triplet (recommended), a CSS-style string, or another Color instance.
g - (optional) If it is defined, the green component of the color.
b - (optional) If it is defined, the blue component of the color.

Note that standard method of specifying color in Verge3D is with a hexadecimal triplet, and that method is used throughout the rest of the documentation.

When all arguments are defined then r is the red component, g is the green component and b is the blue component of the color.
When only r is defined:

• It can be a hexadecimal triplet representing the color (recommended).
• It can be an another Color instance.
• It can be a CSS-style string. For example:
  • 'rgb(250, 0,0)'
  • 'rgb(100%,0%,0%)'
  • 'hsl(0, 100%, 50%)'
  • '#ff0000'
  • '#f00'
  • 'red'

Properties

# .r : Float

Red channel value between 0 and 1. Default is 1.

# .g : Float

Green channel value between 0 and 1. Default is 1.

# .b : Float

Blue channel value between 0 and 1. Default is 1.

Methods

# .add (color : Color) : Color

Adds the RGB values of color to the RGB values of this color.

# .addColors (color1 : Color, color2 : Color) : Color

Sets this color's RGB values to the sum of the RGB values of color1 and color2.

# .addScalar (s : Number) : Color

Adds s to the RGB values of this color.

# .clone () : Color

Returns a new Color with the same r, g and b values as this one.

# .copy (color : Color) : Color

Copies the r, g and b parameters from color in to this color.

# .convertGammaToLinear (gammaFactor : Float) : Color

gammaFactor - (optional). Default is 2.0.

Converts this color from gamma space to linear space by taking r, g and b to the power of gammaFactor.

# .convertLinearToGamma (gammaFactor : Float) : Color

gammaFactor - (optional). Default is 2.0.

Converts this color from linear space to gamma space by taking r, g and b to the power of 1 / gammaFactor.

# .convertLinearToSRGB () : Color

Converts this color from linear space to sRGB space.

# .convertRGBEToLinear (expFactor : Float) : Color

expFactor - RGBE shared exponent.

Converts this color from RGBE format to linear.

# .convertSRGBToLinear () : Color

Converts this color from sRGB space to linear space.

# .copyGammaToLinear (color : Color, gammaFactor : Float) : Color

color — Color to copy.
gammaFactor - (optional). Default is 2.0.

Copies the given color into this color, and then converts this color from gamma space to linear space by taking r, g and b to the power of gammaFactor.

# .copyLinearToGamma (color : Color, gammaFactor : Float) : Color

color — Color to copy.
gammaFactor - (optional). Default is 2.0.

Copies the given color into this color, and then converts this color from linear space to gamma space by taking r, g and b to the power of 1 / gammaFactor.

# .copyLinearToSRGB (color : Color]) : Color

color — Color to copy.
Copies the given color into this color, and then converts this color from linear space to sRGB space.

# .copyRGBEToLinear (color : Color, expFactor : Float]) : Color

color — Color to copy.
expFactor - RGBE shared exponent.

Copies the given color into this color, and then converts this color from RGBE format to linear.

# .copySRGBToLinear (color : Color) : Color

color — Color to copy.
Copies the given color into this color, and then converts this color from sRGB space to linear space.

# .equals (color : Color) : Boolean

Compares the RGB values of color with those of this object. Returns true if they are the same, false otherwise.

# .fromArray (array : Array, offset : Integer) : Color

array - Array of floats in the form [r, g, b].
offset - An optional offset into the array.

Sets this color's components based on an array formatted like [r, g, b].

# .fromBufferAttribute (attribute : BufferAttribute, index : Integer) : this

attribute - the source attribute.
index - index in the attribute.

Sets this color's components from the attribute.

# .getHex () : Integer

Returns the hexadecimal value of this color.

# .getHexString () : String

Returns the hexadecimal value of this color as a string (for example, 'FFFFFF').

# .getHSL (target : Object) : Object

target — the result will be copied into this Object. Adds h, s and l keys to the object (if not already present).

Convert this Color's r, g and b values to HSL format and returns an object of the form: { h: 0, s: 0, l: 0 }

# .getStyle () : String

Returns the value of this color as a CSS style string. Example: 'rgb(255,0,0)'.

# .lerp (color : Color, alpha : Float) : Color

color - color to converge on.
alpha - interpolation factor in the closed interval [0, 1].

Linearly interpolates this color's RGB values toward the RGB values of the passed argument. The alpha argument can be thought of as the ratio between the two colors, where 0.0 is this color and 1.0 is the first argument.

# .lerpHSL (color : Color, alpha : Float) : Color

color - color to converge on.
alpha - interpolation factor in the closed interval [0, 1].

Linearly interpolates this color's HSL values toward the HSL values of the passed argument. It differs from the classic .lerp by not interpolating straight from one color to the other, but instead going through all the hues in between those two colors. The alpha argument can be thought of as the ratio between the two colors, where 0.0 is this color and 1.0 is the first argument.

# .multiply (color : Color) : Color

Multiplies this color's RGB values by the given color's RGB values.

# .multiplyScalar (s : Number) : Color

Multiplies this color's RGB values by s.

# .offsetHSL (h : Float, s : Float, l : Float) : Color

Adds the given h, s, and l to this color's values. Internally, this converts the color's r, g and b values to HSL, adds h, s, and l, and then converts the color back to RGB.

# .set (value : Color_Hex_or_String) : Color

value - Value to set this color to.

See the Constructor above for full details of what value can be. Delegates to .copy, .setStyle, or .setHex depending on input type.

# .setHex (hex : Integer) : Color

hex — hexadecimal triplet format.

Sets this color from a hexadecimal value.

# .setHSL (h : Float, s : Float, l : Float) : Color

h — hue value between 0.0 and 1.0
s — saturation value between 0.0 and 1.0
l — lightness value between 0.0 and 1.0

Sets color from HSL values.

# .setRGB (r : Float, g : Float, b : Float) : Color

r — Red channel value between 0.0 and 1.0.
g — Green channel value between 0.0 and 1.0.
b — Blue channel value between 0.0 and 1.0.

Sets this color from RGB values.

# .setScalar (scalar : Float) : Color

scalar — a value between 0.0 and 1.0.

Sets all three color components to the value scalar.

# .setStyle (style : String) : Color

style — color as a CSS-style string.

Sets this color from a CSS-style string. For example, "rgb(250, 0,0)", "rgb(100%, 0%, 0%)", "hsl(0, 100%, 50%)", "#ff0000", "#f00", or "red" (or any X11 color name - all 140 color names are supported).
Translucent colors such as "rgba(255, 0, 0, 0.5)" and "hsla(0, 100%, 50%, 0.5)" are also accepted, but the alpha-channel coordinate will be discarded.

Note that for X11 color names, multiple words such as Dark Orange become the string 'darkorange' (all lowercase).

# .setColorName (style : String) : Color

style — color name (from X11 color names).

Sets this color from a color name. Faster than .setStyle method if you don't need the other CSS-style formats.

For convenience, the list of names is exposed in Color.NAMES as a hash: Color.NAMES.aliceblue // returns 0xF0F8FF

# .sub (color : Color) : Color

Subtracts the RGB components of the given color from the RGB components of this color. If this results in a negative component, that component is set to zero.

# .toArray (array : Array, offset : Integer) : Array

array - An optional array to store the color to.
offset - An optional offset into the array.

Returns an array of the form [r, g, b].

Source

For more info on how to obtain the source code of this module see this page.