Awesome
css-color
Class for manipulating color values for css, svg, canvas/image, etc..
version 1.0.0
Color Formats: HEX, RGB(A), HSL(A), HWB, HSV, CMYK
example:
let rgb = new Color([128, 255, 245, 1]).toRGB(asString, condenced, noTransparency);
let hsl = new Color([128, 255, 245, 1]).toHSL(asString, condenced, noTransparency);
let hwb = new Color([128, 255, 245, 1]).toHWB(asString, condenced, noTransparency);
let cmyk = new Color([128, 255, 245, 1]).toCMYK(asString, condenced, withTransparency);
// or using a constructor factory pattern
let rgb = Color([128, 255, 245, 1]).toRGB(asString, condenced, noTransparency);
let hsl = Color([128, 255, 245, 1]).toHSL(asString, condenced, noTransparency);
let hwb = Color([128, 255, 245, 1]).toHWB(asString, condenced, noTransparency);
let cmyk = Color([128, 255, 245, 1]).toCMYK(asString, condenced, withTransparency);
let color = new Color().fromRGB([255, 255, 255, 0.3]);
// or via static method
let color = Color.fromRGB([255, 255, 255]);
let color = new Color().fromHSL([120, 50, 100, 0.7]);
// or via static method
let color = Color.fromHSL([120, 50, 100]);
let color = new Color().fromHSV([120, 50, 100, 0.7]);
// or via static method
let color = CSS.Color.fromHSV([120, 50, 100]);
let color = new Color().fromHWB([120, 50, 100, 0.7]);
// or via static method
let color = Color.fromHWB([120, 50, 100]);
let color = new Color().fromHEX([0xff, 0xaa, 0x00, 0xfa]);
// or via static method
let color = Color.fromHEX([0xff, 0xaa, 0x00]);
let color = new Color().fromPixel(0xff3d1208);
// or via static method
let color = Color.fromPixel(0xff3d1208);
let color = new Color().fromKeyword('orange');
// or via static method
let color = Color.fromKeyword('orange');
let color = new Color().fromCMYK([1, 0.3, 0.5, 1]);
// or via static method
let color = Color.fromCMYK([1, 0.3, 0.5, 1]);
// also
let color = Color.fromString('rgba(255, 100%, 100%, 0.7)');
let color = Color.fromString('hsla(120, 50%, 100%, 0.5)');
let color = Color.fromString('hwb(120 50% 100% / 0.5)');
let color = Color.fromString('#fff');
let color = Color.fromString('slategrey');
// output
console.log(color.toHSL(asString, condenced, noTransparency)); // hsla(..)
console.log(color.toHWB(asString, condenced, noTransparency)); // hwb(..)
console.log(color.toHEX(asString, condenced, withTransparency)); // #..
console.log(color.toRGB(asString, condenced, noTransparency)); // rgb(255, 255, 255)
console.log(color.toHSL(asString, condenced, noTransparency)); // hsl(..)
console.log(color.toHWB(asString, condenced, noTransparency)); // hwb(..)
console.log(color.toCMYK(asString, condenced, withTransparency)); // CMYK: [..]
console.log(color.toPixel(withTransparency)); // 0x...
console.log(color.toKeyword(asString, condenced, withTransparency)); // only if color was set from keyword
// also
console.log(color.toString('hsla', condenced));
console.log(color.toString('hsl', condenced));
console.log(color.toString('hwb', condenced));
console.log(color.toString('rgb', condenced));
console.log(color.toString('rgba', condenced));
console.log(color.toString('keyword', condenced)); // only if color was set from keyword
console.log(color.toString('hex', condenced));
console.log(color.toString('hexie', condenced)); // with transparency added
// etc ..
// also
console.log(color.isTransparent()); // whether color has opacity < 1
console.log(color.isKeyword()); // whether color was set from a keyword
// also
color.colorStop('0%'); // set an associated color stop to this color
console.log(color.toColorStop(compatible)); // rgba(..) 0%
see also:
- CanvasLite an html canvas implementation in pure JavaScript
- Rasterizer stroke and fill lines, rectangles, curves and paths, without canvaσ
- Gradient create linear, radial, conic and elliptic gradients and image patterns without canvas
- Geometrize Computational Geometry and Rendering Library for JavaScript
- Plot.js simple and small library which can plot graphs of functions and various simple charts and can render to Canvas, SVG and plain HTML
- MOD3 3D Modifier Library in JavaScript
- HAAR.js image feature detection based on Haar Cascades in JavaScript (Viola-Jones-Lienhart et al Algorithm)
- HAARPHP image feature detection based on Haar Cascades in PHP (Viola-Jones-Lienhart et al Algorithm)
- FILTER.js video and image processing and computer vision Library in pure JavaScript (browser and node)
- css-color simple class to parse and manipulate colors in various formats