Miss any of our Open RFC calls?Watch the recordings here! »

ccc

0.5.1 • Public • Published

ccc Build Status

Color conversions and transformations

Install

npm install --save ccc
component install andrepolischuk/ccc

API

ccc(str)

Create color via string

var color = ccc('black');
var color = ccc('#ffffff');
var color = ccc('rgb(255, 0, 0)');
var color = ccc('rgba(255, 0, 0, 0.5)');
var color = ccc('hsl(240, 100%, 50%)');
var color = ccc('hsla(240, 100%, 50%, 0.7)');

ccc(obj)

Create color via object

var color = ccc({r: 255, g: 0, b: 0});
var color = ccc({r: 255, g: 0, b: 0, a: 0.5});
var color = ccc({c: 100, m: 0, y: 100, k: 0});
var color = ccc({h: 240, s: 100, l: 50});
var color = ccc({h: 60, s: 100, v: 100});

ccc.rgb(...arguments)

Create color via arguments

var color = ccc.keyword('black');
var color = ccc.hex('ffffff');
var color = ccc.rgb(255, 0, 0);
var color = ccc.rgb(255, 0, 0, 0.5);
var color = ccc.cmyk(100, 0, 100, 0);
var color = ccc.hsl(240, 100, 50);
var color = ccc.hsl(240, 100, 50, 0.7);
var color = ccc.hsv(60, 100, 100);

ccc.rgb(arr)

Create color via array

var color = ccc.rgb([255, 0, 0]);
var color = ccc.rgb([255, 0, 0, 0.5]);
var color = ccc.cmyk([100, 0, 100, 0]);
var color = ccc.hsl([240, 100, 50]);
var color = ccc.hsl([240, 100, 50, 0.7]);
var color = ccc.hsv([60, 100, 100]);

.rgb()

Return converted color object

color.rgb(); // {r: 255, g: 0, b: 0}
color.cmyk(); // {c: 100, m: 0, y: 100, k: 0}
color.hsl(); // {h: 240, s: 100, l: 50}
color.hsv(); // {h: 60, s: 100, v: 100}

.rgbArray()

Return converted color array

color.rgbArray(); // [255, 0, 0]
color.cmykArray(); // [100, 0, 100, 0]
color.hslArray(); // [240, 100, 50]
color.hsvArray(); // [60, 100, 100]

.rgbString()

Return converted color string

color.keyword(); // 'black'
color.hex(); // '#ffffff'
color.rgbString(); // rgb(255, 0, 0)
color.hslString(); // hsl(240, 100%, 50%)

.invert()

Invert color

ccc('#ffffff').invert().hex(); // #000000

.grayscale()

Convert color to grayscale

ccc('#669900').grayscale().hex(); // #787878

.average(Color2)

Calculate average

ccc('#333333').average(ccc('#999999')).hex(); // #666666

.light()

Check if color is light

ccc('white').light(); // true

.dark()

Check if color is dark

ccc('black').dark(); // true

.lighten(val)

Lighten color by val

ccc('#000000').lighten(50).hex(); // #080808

.darken(val)

Darken color by val

ccc('#ffffff').darken(50).hex(); // #080808

.saturate(val)

Saturate color by val

ccc('gray').saturate(50).saturation(); // 50

.desaturate(val)

Desaturate color by val

ccc('red').desaturate(50).saturation(); // 50

.red([val])

Return or set red component of RGB

ccc('red').red(); // 255
ccc('black').red(255).keyword(); // red

.green([val])

Return or set green component of RGB

ccc('green').green(); // 255
ccc('black').green(255).keyword(); // lime

.blue([val])

Return or set blue component of RGB

ccc('blue').blue(); // 255
ccc('black').blue(255).keyword(); // blue

.alpha([val])

Return or set alpha component

ccc('rgba(0, 0, 0, 0.5)').alpha(); // 0.5
ccc('black').alpha(0.5).rgbString(); // rgba(0, 0, 0, 0.5)

.cyan([val])

Return or set cyan component of CMYK

ccc('aqua').cyan(); // 100
ccc('white').cyan(100).keyword(); // aqua

.magenta([val])

Return or set magenta component of CMYK

ccc('fuchsia').magenta(); // 100
ccc('white').magenta(100).keyword(); // fuchsia

.yellow([val])

Return or set yellow component of CMYK

ccc('yellow').cyan(); // 100
ccc('white').cyan(100).keyword(); // yellow

.key([val])

Return or set key component of CMYK

ccc('black').key(); // 100
ccc('white').key(100).keyword(); // black

.hue([val])

Return or set hue component of HSL

ccc('red').hue(); // 0
ccc('lime').hue(240).keyword(); // blue

.saturation([val])

Return or set saturation component of HSL

ccc('lime').saturation(); // 100
ccc('gray').saturation(100).keyword(); // red

.lightness([val])

Return or set lightness component of HSL

ccc('blue').lightness(); // 50
ccc('lime').lightness(25).keyword(); // green

.value([val])

Return or set value component of HSB

ccc('yellow').value(); // 100
ccc('lime').value(50).keyword(); // green

License

MIT

Install

npm i ccc

DownloadsWeekly Downloads

12

Version

0.5.1

License

MIT

Last publish

Collaborators

  • avatar