color
JavaScript library for immutable color conversion and manipulation with support for CSS color strings.
const color = Color('#7743CE').alpha(0.5).lighten(0.5);
console.log(color.hsl().string());
console.log(color.cmyk().round().array());
console.log(color.ansi256().object());
Install
$ npm install color
Usage
const Color = require('color');
Constructors
const color = Color('rgb(255, 255, 255)')
const color = Color({r: 255, g: 255, b: 255})
const color = Color.rgb(255, 255, 255)
const color = Color.rgb([255, 255, 255])
Set the values for individual channels with alpha
, red
, green
, blue
, hue
, saturationl
(hsl), saturationv
(hsv), lightness
, whiteness
, blackness
, cyan
, magenta
, yellow
, black
String constructors are handled by color-string
Getters
color.hsl();
Convert a color to a different space (hsl()
, cmyk()
, etc.).
color.object();
Get a hash of the color value. Reflects the color's current model (see above).
color.rgb().array()
Get an array of the values with array()
. Reflects the color's current model (see above).
color.rgbNumber()
Get the rgb number value.
color.hex()
Get the hex value. (NOTE: .hex()
does not return alpha values; use .hexa()
for an RGBA representation)
color.red()
Get the value for an individual channel.
CSS Strings
color.hsl().string()
Calling .string()
with a number rounds the numbers to that decimal place. It defaults to 1.
Luminosity
color.luminosity();
The WCAG luminosity of the color. 0 is black, 1 is white.
color.contrast(Color("blue"))
The WCAG contrast ratio to another color, from 1 (same color) to 21 (contrast b/w white and black).
color.isLight();
color.isDark();
Get whether the color is "light" or "dark", useful for deciding text color.
Manipulation
color.negate()
color.lighten(0.5)
color.lighten(0.5)
color.darken(0.5)
color.darken(0.5)
color.lightness(50)
color.saturate(0.5)
color.desaturate(0.5)
color.grayscale()
color.whiten(0.5)
color.blacken(0.5)
color.fade(0.5)
color.opaquer(0.5)
color.rotate(180)
color.rotate(-90)
color.mix(Color("yellow"))
color.mix(Color("yellow"), 0.3)
color.green(100).grayscale().lighten(0.6)
Propers
The API was inspired by color-js. Manipulation functions by CSS tools like Sass, LESS, and Stylus.