- Notifications
You must be signed in to change notification settings - Fork0
simple class for manipulating color values and color formats for css, svg, canvas/image
NotificationsYou must be signed in to change notification settings
foo123/css-color
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
Class for manipulating color values for css, svg, canvas/image, etc..
version1.0.0
Color Formats: HEX, RGB(A), HSL(A), HWB, HSV, CMYK
example:
letrgb=newColor([128,255,245,1]).toRGB(asString,condenced,noTransparency);lethsl=newColor([128,255,245,1]).toHSL(asString,condenced,noTransparency);lethwb=newColor([128,255,245,1]).toHWB(asString,condenced,noTransparency);letcmyk=newColor([128,255,245,1]).toCMYK(asString,condenced,withTransparency);// or using a constructor factory patternletrgb=Color([128,255,245,1]).toRGB(asString,condenced,noTransparency);lethsl=Color([128,255,245,1]).toHSL(asString,condenced,noTransparency);lethwb=Color([128,255,245,1]).toHWB(asString,condenced,noTransparency);letcmyk=Color([128,255,245,1]).toCMYK(asString,condenced,withTransparency);letcolor=newColor().fromRGB([255,255,255,0.3]);// or via static methodletcolor=Color.fromRGB([255,255,255]);letcolor=newColor().fromHSL([120,50,100,0.7]);// or via static methodletcolor=Color.fromHSL([120,50,100]);letcolor=newColor().fromHSV([120,50,100,0.7]);// or via static methodletcolor=CSS.Color.fromHSV([120,50,100]);letcolor=newColor().fromHWB([120,50,100,0.7]);// or via static methodletcolor=Color.fromHWB([120,50,100]);letcolor=newColor().fromHEX([0xff,0xaa,0x00,0xfa]);// or via static methodletcolor=Color.fromHEX([0xff,0xaa,0x00]);letcolor=newColor().fromPixel(0xff3d1208);// or via static methodletcolor=Color.fromPixel(0xff3d1208);letcolor=newColor().fromKeyword('orange');// or via static methodletcolor=Color.fromKeyword('orange');letcolor=newColor().fromCMYK([1,0.3,0.5,1]);// or via static methodletcolor=Color.fromCMYK([1,0.3,0.5,1]);// alsoletcolor=Color.fromString('rgba(255, 100%, 100%, 0.7)');letcolor=Color.fromString('hsla(120, 50%, 100%, 0.5)');letcolor=Color.fromString('hwb(120 50% 100% / 0.5)');letcolor=Color.fromString('#fff');letcolor=Color.fromString('slategrey');// outputconsole.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// alsoconsole.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 keywordconsole.log(color.toString('hex',condenced));console.log(color.toString('hexie',condenced));// with transparency added// etc ..// alsoconsole.log(color.isTransparent());// whether color has opacity < 1console.log(color.isKeyword());// whether color was set from a keyword// alsocolor.colorStop('0%');// set an associated color stop to this colorconsole.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
About
simple class for manipulating color values and color formats for css, svg, canvas/image
Topics
Resources
Uh oh!
There was an error while loading.Please reload this page.
Stars
Watchers
Forks
Packages0
No packages published