colorficial

Determine the name of a color easily.

View the Project on GitHub kaanon/colorficial

Demo Play with the demo

colorficial is a Javascript Class to be used for analyzing colors. It can provide functionality to determine if a color is dark, light or a specific color. Each object also has a hue, saturation, value, lightness (or brightness) and can be exported as a css declaration.

Instantiation

var c = new Color(255,100,100);
var c = new Color([255,100,100]);
var c = new Color('#FF9922');
var c = new Color({r: 255, g: 100, b: 100});
var c = new Color({red: 255, green: 100, blue: 100});

Color Methods

var c = new Color([10, 215, 180]);
c.name();
// 'green'
c.names();
// ['green','blue']

c.isLight();
// true (if brightness > 200)
c.isLight(100);
// true (if brightness > 100);

c.isDark();
// true (if brightness < 85)
c.isDark(100);
// true (if brightness < 100);

c.is('red');
// false
c.is('green');
// true

Color Attributes

var c = new Color([11, 170, 181]);
c.red;
// 11
c.green;
// 170
c.blue
// 181
c.hue
// 183.88  (measured between 0° and 360°)
c.brightness
// 37.65 (measured between 0 and 100)
c.lightness
// 37.65 (synonym of brightness)
c.saturation
// 88.54 (measured between 0 and 100)
c.value
// 0.7098039215686275 (measured between 0 and 1)

Utility Methods

var c = new Color([11, 170, 181]);

c.css();
// "rgb(11,170,181)"
c.css(0.5);
// "rgba(11,170,181,0.5)"
c.cssHSL();
// "hsl(11,170,181,0.5)"
c.cssHSV();
// "hsv(11,170,181,0.5)"
c.toJSON();
// { red: 11, green: 170, blue: 181 }
c.toArray();
// [ 11, 170, 181 ]
c.toString()
// "[11, 170, 181]"

Caveats

Teals (blue/green) are difficult to pin, as are darker pinks.

Supported Colors

Installation

bower install colorficial

License

MIT © Kaanon MacFarlane