Nodeschool Public Materials

    color
    DefinitelyTyped icon, indicating that this package has TypeScript declarations provided by the separate @types/color package

    0.1.0 • Public • Published

    css-color

    css-color is a library for color conversion and manipulation with support for CSS color strings.

    var color = Color("#77E4FE");
    
    color.red(120).lighten(.5);
    
    console.log(color.hslString());  // "hsl(192, 99%, 110%)"

    Install

    node

    For node with npm:

    npm install color
    

    browser

    Download the latest color.js. The Color object is exported.

    API

    Setters

    var color = Color("rgb(255, 255, 255)")

    Pass any valid CSS string into Color(), like "#FFFFFF", "#fff", "white", "hsla(360, 100%, 100%, 0.5)"

    var color = Color({r: 255, g: 255, b: 255})

    You can also pass a hash of color values into Color(), keyed on r or red for example.

    var color = Color().rgb(255, 255, 255)

    Load in color values with rgb(), hsl(), hsv(),and cmyk(). The arguments can also be an array or hash.

    Getters

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

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

    color.rgbArray()  // [255, 255, 255]

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

    color.red()       // 255

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

    color.red(100).alpha(0.6)

    Also set the value of any channel.

    CSS Strings

    color.hslString()  // "hsl(320, 50%, 100%)"

    Different CSS String formats for the color are on hexString, rgbString, percentString, hslString, and keyword (undefined if it's not a keyword color). "rgba" and "hsla" are used if the current alpha value of the color isn't 1.

    Manipulation

    color.greyscale()   // #5CBF54 -> #969696
    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%)
    
    // chaining
    color.green(100).greyscale().lighten(0.6)

    And more to come...

    Install

    npm i color@0.1.0

    Version

    0.1.0

    License

    MIT

    Last publish

    Collaborators

    • qix