Package Exports

sumi-color

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (sumi-color) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

sumi-color

A standalone JavaScript library for all kinds of color manipulations. Tiny but powerful.

Target environments

IE 6+
Latest Stable: Firefox, Chrome, Safari, Opera
Node.js

There is no doubt that you can also use this library in browser extensions and other non-browser environments, such as Rhino or SpiderMonkey.

Features

Seamless conversion between dozens of color space(rgb, ryb, hsl, hsv, hwb, cmy, cmyk, yiq, yuv, xyz, xyy, luv, lab, lch, etc..) and CSS keywords. It caches conversions.
Color Instances have getters/setters for all channels(red, green, blue, hue, saturation, lightness, opacity, blackness, whiteness, etc..) in all supported colorspaces.
Many useful classes and methods: Gradient, Palette, tint, shade, tone, color blending and color scale, luminance and color difference calculator, scheme generator, etc.
So powerful but ridiculously tiny. It has no dependencies. The entire set of modules clocks in at 8kb minified and gzipped.
Lots more. Take a look at the documentation immediately.

Quick start

Four quick start options are available:

Download the latest release
Clone the repo: git clone https://github.com/rainersu/color.git
Install with Bower: bower install sumi-color
Install with npm: npm install sumi-color

Example use

Including in a browser:

<script type='text/javascript' src='/path/to/sumi-color-1.0.6.min.js'></script>
<script type='text/javascript'>
var Color = sumiColor.Color;
var tiffanyblue = new Color('#60DFE5');

window.alert(tiffanyblue.css(2, true));   // hsla(183, 72%, 64%, 1)

</script>

As a module that works with AMD(e.g., RequireJS):

define(['/path/to/sumi-color'], function(sumiColor) {
    var Gradient = sumiColor.Gradient;
    var rad = new Gradient([ 'black', '#60DFE5', 'white' ], [ -0.2, 0.1, 0.2 ]);

    console.log(rad.css());
    
    // linear-gradient(0deg, rgb(0, 0, 0), rgb(96, 223, 229) 75%, rgb(255, 255, 255))

});

Including in a CommonJS environment(e.g., Node.js):

var Color = require('/path/to/sumi-color').Color;
var pat = new Palette([ '#FFF', '#000', '#60DFE5' ], [ 1, 2, 3 ], 22);

console.log(pat.css());   // rgba(91, 154, 157, 0.22)

Build from source

First, you need to have Node.js and Grunt installed.

$ git clone git@github.com:rainersu/color.git
$ npm install -g grunt-cli
$ cd color
$ npm install
$ grunt

It provides compiled JS (sumi-color.*), as well as compiled and minified JS (sumi-color.min.*). JS source maps (sumi-color.*.map) are available for use with certain browsers' developer tools.

Running demos for testing

$ grunt test

Build & running documentation locally

$ grunt help

Sorry, the documentation is currently offered only in the Chinese language. Do you have time to help me with some Chinese - English translations?

How to contact me

Copyright and license

Code and documentation is free to use under the BSD license.