node package manager

color

Color conversion and manipulation with CSS string support

color

JavaScript library for immutable color conversion and manipulation with support for CSS color strings.

var color = Color('#7743CE').alpha(0.5).lighten(0.5);
console.log(color.hsl().string());  // 'hsla(262, 59%, 81%, 0.5)' 
 
console.log(color.cmyk().round().array());  // [ 16, 25, 0, 8, 0.5 ] 
 
console.log(color.ansi256().object());  // { ansi256: 183, alpha: 0.5 } 
$ npm install color
var Color = require('color');
var color = Color('rgb(255, 255, 255)')
var color = Color({r: 255, g: 255, b: 255})
var color = Color.rgb(255, 255, 255)
var color = Color.rgb([255, 255, 255])

Set the values for individual channels with alpha, red, green, blue, hue, saturation (hsl), saturationv (hsv), lightness, whiteness, blackness, cyan, magenta, yellow, black

color.rgb()       // {r: 255, g: 255, b: 255} 

Get a hash of the rgb values with rgb(), similarly for hsl(), hsv(), and cmyk()

color.rgb().array()  // [255, 255, 255] 

Get an array of the values with rgbArray(), hslArray(), hsvArray(), and cmykArray().

color.red()       // 255 

Get the value for an individual channel.

color.hsl().string()  // 'hsl(320, 50%, 100%)' 

Calling .string() with a number rounds the numbers to that decimal place. It defaults to 1.

color.luminosity();  // 0.412 

The WCAG luminosity of the color. 0 is black, 1 is white.

color.contrast(Color("blue"))  // 12 

The WCAG contrast ratio to another color, from 1 (same color) to 21 (contrast b/w white and black).

color.light();  // true 
color.dark();   // false 

Get whether the color is "light" or "dark", useful for deciding text color.

color.negate()         // rgb(0, 100, 255) -> rgb(255, 155, 0) 
 
color.lighten(0.5)     // hsl(100, 50%, 50%) -> hsl(100, 50%, 75%) 
color.darken(0.5)      // hsl(100, 50%, 50%) -> hsl(100, 50%, 25%) 
 
color.saturate(0.5)    // hsl(100, 50%, 50%) -> hsl(100, 75%, 50%) 
color.desaturate(0.5)  // hsl(100, 50%, 50%) -> hsl(100, 25%, 50%) 
color.grayscale()      // #5CBF54 -> #969696 
 
color.whiten(0.5)      // hwb(100, 50%, 50%) -> hwb(100, 75%, 50%) 
color.blacken(0.5)     // hwb(100, 50%, 50%) -> hwb(100, 50%, 75%) 
 
color.fade(0.5)     // rgba(10, 10, 10, 0.8) -> rgba(10, 10, 10, 0.4) 
color.opaquer(0.5)     // rgba(10, 10, 10, 0.8) -> rgba(10, 10, 10, 1.0) 
 
color.rotate(180)      // hsl(60, 20%, 20%) -> hsl(240, 20%, 20%) 
color.rotate(-90)      // hsl(60, 20%, 20%) -> hsl(330, 20%, 20%) 
 
color.mix(Color("yellow"))        // cyan -> rgb(128, 255, 128) 
color.mix(Color("yellow"), 0.3)   // cyan -> rgb(77, 255, 179) 
 
// chaining 
color.green(100).grayscale().lighten(0.6)

The API was inspired by color-js. Manipulation functions by CSS tools like Sass, LESS, and Stylus.