Skip to content

Commit a6e6f67

Browse files
ChristinaRauChristinaRau
authored
Added more constructor examples (#181) (#260)
1 parent e188999 commit a6e6f67

1 file changed

Lines changed: 65 additions & 5 deletions

File tree

‎README.md‎

Lines changed: 65 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -23,18 +23,78 @@ const Color = require('color');
2323

2424
### Constructors
2525
```js
26-
const color = Color('rgb(255, 255, 255)')
27-
const color = Color({r: 255, g: 255, b: 255})
28-
const color = Color.rgb(255, 255, 255)
29-
const color = Color.rgb([255, 255, 255])
26+
// string constructor
27+
const color = Color('rgb(255, 255, 255)') // { model: 'rgb', color: [ 255, 255, 255 ], valpha: 1 }
28+
const color = Color('hsl(194, 53%, 79%)') // { model: 'hsl', color: [ 195, 53, 79 ], valpha: 1 }
29+
const color = Color('hsl(194, 53%, 79%, 0.5)') // { model: 'hsl', color: [ 195, 53, 79 ], valpha: 0.5 }
30+
const color = Color('#FF0000') // { model: 'rgb', color: [ 255, 0, 0 ], valpha: 1 }
31+
const color = Color('#FF000033') // { model: 'rgb', color: [ 255, 0, 0 ], valpha: 0.2 }
32+
const color = Color('lightblue') // { model: 'rgb', color: [ 173, 216, 230 ], valpha: 1 }
33+
const color = Color('purple') // { model: 'rgb', color: [ 128, 0, 128 ], valpha: 1 }
34+
35+
// rgb
36+
const color = Color({r: 255, g: 255, b: 255}) // { model: 'rgb', color: [ 255, 255, 255 ], valpha: 1 }
37+
const color = Color({r: 255, g: 255, b: 255, alpha: 0.5}) // { model: 'rgb', color: [ 255, 255, 255 ], valpha: 0.5 }
38+
const color = Color.rgb(255, 255, 255) // { model: 'rgb', color: [ 255, 255, 255 ], valpha: 1 }
39+
const color = Color.rgb(255, 255, 255, 0.5) // { model: 'rgb', color: [ 255, 255, 255 ], valpha: 0.5 }
40+
const color = Color.rgb(0xFF, 0x00, 0x00, 0.5) // { model: 'rgb', color: [ 255, 0, 0 ], valpha: 0.5 }
41+
const color = Color.rgb([255, 255, 255]) // { model: 'rgb', color: [ 255, 255, 255 ], valpha: 1 }
42+
const color = Color.rgb([0xFF, 0x00, 0x00, 0.5]) // { model: 'rgb', color: [ 255, 0, 0 ], valpha: 0.5 }
43+
44+
// hsl
45+
const color = Color({h: 194, s: 53, l: 79}) // { model: 'hsl', color: [ 195, 53, 79 ], valpha: 1 }
46+
const color = Color({h: 194, s: 53, l: 79, alpha: 0.5}) // { model: 'hsl', color: [ 195, 53, 79 ], valpha: 0.5 }
47+
const color = Color.hsl(194, 53, 79) // { model: 'hsl', color: [ 195, 53, 79 ], valpha: 1 }
48+
49+
// hsv
50+
const color = Color({h: 195, s: 25, v: 99}) // { model: 'hsv', color: [ 195, 25, 99 ], valpha: 1 }
51+
const color = Color({h: 195, s: 25, v: 99, alpha: 0.5}) // { model: 'hsv', color: [ 195, 25, 99 ], valpha: 0.5 }
52+
const color = Color.hsv(195, 25, 99) // { model: 'hsv', color: [ 195, 25, 99 ], valpha: 1 }
53+
const color = Color.hsv([195, 25, 99]) // { model: 'hsv', color: [ 195, 25, 99 ], valpha: 1 }
54+
55+
// cmyk
56+
const color = Color({c: 0, m: 100, y: 100, k: 0}) // { model: 'cmyk', color: [ 0, 100, 100, 0 ], valpha: 1 }
57+
const color = Color({c: 0, m: 100, y: 100, k: 0, alpha: 0.5}) // { model: 'cmyk', color: [ 0, 100, 100, 0 ], valpha: 0.5 }
58+
const color = Color.cmyk(0, 100, 100, 0) // { model: 'cmyk', color: [ 0, 100, 100, 0 ], valpha: 1 }
59+
const color = Color.cmyk(0, 100, 100, 0, 0.5) // { model: 'cmyk', color: [ 0, 100, 100, 0 ], valpha: 0.5 }
60+
61+
// hwb
62+
const color = Color({h: 180, w: 0, b: 0}) // { model: 'hwb', color: [ 180, 0, 0 ], valpha: 1 }
63+
const color = Color.hwb(180, 0, 0) // { model: 'hwb', color: [ 180, 0, 0 ], valpha: 1 }
64+
65+
// lch
66+
const color = Color({l: 53, c: 105, h: 40}) // { model: 'lch', color: [ 53, 105, 40 ], valpha: 1 }
67+
const color = Color.lch(53, 105, 40) // { model: 'lch', color: [ 53, 105, 40 ], valpha: 1 }
68+
69+
// lab
70+
const color = Color({l: 53, a: 80, b: 67}) // { model: 'lab', color: [ 53, 80, 67 ], valpha: 1 }
71+
const color = Color.lab(53, 80, 67) // { model: 'lab', color: [ 53, 80, 67 ], valpha: 1 }
72+
73+
// hcg
74+
const color = Color({h: 0, c: 100, g: 0}) // { model: 'hcg', color: [ 0, 100, 0 ], valpha: 1 }
75+
const color = Color.hcg(0, 100, 0) // { model: 'hcg', color: [ 0, 100, 0 ], valpha: 1 }
76+
77+
// ansi16
78+
const color = Color.ansi16(91) // { model: 'ansi16', color: [ 91 ], valpha: 1 }
79+
const color = Color.ansi16(91, 0.5) // { model: 'ansi16', color: [ 91 ], valpha: 0.5 }
80+
81+
// ansi256
82+
const color = Color.ansi256(196) // { model: 'ansi256', color: [ 196 ], valpha: 1 }
83+
const color = Color.ansi256(196, 0.5) // { model: 'ansi256', color: [ 196 ], valpha: 0.5 }
84+
85+
// apple
86+
const color = Color.apple(65535, 65535, 65535) // { model: 'apple', color: [ 65535, 65535, 65535 ], valpha: 1 }
87+
const color = Color.apple([65535, 65535, 65535]) // { model: 'apple', color: [ 65535, 65535, 65535 ], valpha: 1 }
88+
89+
3090
```
3191

3292
Set the values for individual channels with `alpha`, `red`, `green`, `blue`, `hue`, `saturationl` (hsl), `saturationv` (hsv), `lightness`, `whiteness`, `blackness`, `cyan`, `magenta`, `yellow`, `black`
3393

3494
String constructors are handled by [color-string](https://www.npmjs.com/package/color-string)
3595

3696
### Getters
37-
```js
97+
```jss
3898
color.hsl();
3999
```
40100
Convert a color to a different space (`hsl()`, `cmyk()`, etc.).

0 commit comments

Comments
 (0)