All properties and functions that expect color values in the form of instances of Color objects, also accept named colors and hex values as strings which are then converted to instances of Color internally.
Example — Named color values:
Example — Hex color values:
Creates a RGB Color object.
Example — Creating a RGB Color:
Creates a gray Color object.
Example — Creating a gray Color:
Creates a HSB, HSL or gradient Color object from the properties of the provided object:
HSB Color:
hue: Number — the hue of the color as a value in
degrees between 0 and 360
saturation: Number — the saturation of the color as a
value between 0 and 1
brightness: Number — the brightness of the color as a
value between 0 and 1
alpha: Number — the alpha of the color as a value between
0 and 1
HSL Color:
hue: Number — the hue of the color as a value in
degrees between 0 and 360
saturation: Number — the saturation of the color as a
value between 0 and 1
lightness: Number — the lightness of the color as a
value between 0 and 1
alpha: Number — the alpha of the color as a value between
0 and 1
Gradient Color:
gradient: Gradient — the gradient object that describes the
color stops and type of gradient to be used.
origin: Point — the origin point of the gradient
destination: Point — the destination point of the gradient
stops: Array of GradientStop — the gradient stops describing
the gradient, as an alternative to providing a gradient object
radial: Boolean — controls whether the gradient is radial,
as an alternative to providing a gradient object
Example — Creating a HSB Color:
Example — Creating a HSL Color:
Example — Creating a gradient color from an object literal:
Creates a gradient Color object.
Example — Applying a linear gradient color containing evenly distributed color stops:
Example — Applying a radial gradient color containing unevenly distributed color stops:
Returns the addition of the supplied value to both coordinates of the color as a new color.
The object itself is not modified!
Example
var color = new Color(0.5, 1, 1); var result = color + 1; console.log(result); // { red: 1, blue: 1, green: 1 }
Returns the addition of the supplied color to the color as a new color.
The object itself is not modified!
Example
var color1 = new Color(0, 1, 1); var color2 = new Color(1, 0, 0); var result = color1 + color2; console.log(result); // { red: 1, blue: 1, green: 1 }
Returns the subtraction of the supplied value to both coordinates of the color as a new color.
The object itself is not modified!
Example
var color = new Color(0.5, 1, 1); var result = color - 1; console.log(result); // { red: 0, blue: 0, green: 0 }
Returns the subtraction of the supplied color to the color as a new color.
The object itself is not modified!
Example
var color1 = new Color(0, 1, 1); var color2 = new Color(1, 0, 0); var result = color1 - color2; console.log(result); // { red: 0, blue: 1, green: 1 }
Returns the multiplication of the supplied value to both coordinates of the color as a new color.
The object itself is not modified!
Example
var color = new Color(0.5, 1, 1); var result = color * 0.5; console.log(result); // { red: 0.25, blue: 0.5, green: 0.5 }
Returns the multiplication of the supplied color to the color as a new color.
The object itself is not modified!
Example
var color1 = new Color(0, 1, 1); var color2 = new Color(0.5, 0, 0.5); var result = color1 * color2; console.log(result); // { red: 0, blue: 0, green: 0.5 }
Returns the division of the supplied value to both coordinates of the color as a new color.
The object itself is not modified!
Example
var color = new Color(0.5, 1, 1); var result = color / 2; console.log(result); // { red: 0.25, blue: 0.5, green: 0.5 }
Returns the division of the supplied color to the color as a new color.
The object itself is not modified!
Example
var color1 = new Color(0, 1, 1); var color2 = new Color(0.5, 0, 0.5); var result = color1 / color2; console.log(result); // { red: 0, blue: 0, green: 1 }
The type of the color as a string.
Example
var color = new Color(1, 0, 0); console.log(color.type); // 'rgb'
The color components that define the color, including the alpha value if defined.
Read only.
The color's alpha value as a number between 0 and 1.
All colors of the different subclasses support alpha values.
Example — A filled path with a half transparent stroke:
The amount of red in the color as a value between 0 and 1.
Example — Changing the amount of red in a color:
The amount of green in the color as a value between 0 and 1.
Example — Changing the amount of green in a color:
The amount of blue in the color as a value between 0 and 1.
Example — Changing the amount of blue in a color:
The amount of gray in the color as a value between 0 and 1.
The hue of the color as a value in degrees between 0 and 360.
Example — Changing the hue of a color:
Example — Hue cycling:
The saturation of the color as a value between 0 and 1.
The brightness of the color as a value between 0 and 1.
The lightness of the color as a value between 0 and 1.
Note that all other components are shared with HSB.
Converts the color another type.
Checks if the color has an alpha value.
Checks if the component color values of the color are the same as those of the supplied one.
Returns the color as a CSS string.
Transform the gradient color by the specified matrix.
Copyright © 2011 Jürg Lehni & Jonathan Puckey. All Rights Reserved.