Shade Examples
These examples are equivalent to building an array of darkened colors.
let scheme: Color.hex[] = Color.from('hex', 'ee5588')
.scheme('shade', {
method: /* methods listed below */,
colors: 10
})
shade
hsl
hsl:{"h":340,"s":82,"l":63,"a":100}hsl:{"h":340,"s":82,"l":56,"a":100}hsl:{"h":340,"s":82,"l":49,"a":100}hsl:{"h":340,"s":81,"l":42,"a":100}hsl:{"h":340,"s":82,"l":35,"a":100}hsl:{"h":340,"s":82,"l":28,"a":100}hsl:{"h":340,"s":81,"l":21,"a":100}hsl:{"h":340,"s":81,"l":14,"a":100}hsl:{"h":340,"s":83,"l":7,"a":100}hsl:{"h":0,"s":0,"l":0,"a":100}shade
hsv
hsv:{"h":340,"s":64,"v":93,"a":100}hsv:{"h":340,"s":64,"v":83,"a":100}hsv:{"h":340,"s":64,"v":73,"a":100}hsv:{"h":340,"s":64,"v":62,"a":100}hsv:{"h":340,"s":64,"v":52,"a":100}hsv:{"h":341,"s":64,"v":42,"a":100}hsv:{"h":340,"s":65,"v":31,"a":100}hsv:{"h":341,"s":64,"v":21,"a":100}hsv:{"h":339,"s":65,"v":10,"a":100}hsv:{"h":0,"s":0,"v":0,"a":100}shade
hsi
hsi:{"h":341,"s":44,"i":60,"a":100}hsi:{"h":341,"s":44,"i":53,"a":100}hsi:{"h":341,"s":45,"i":47,"a":100}hsi:{"h":341,"s":44,"i":40,"a":100}hsi:{"h":340,"s":45,"i":33,"a":100}hsi:{"h":342,"s":44,"i":27,"a":100}hsi:{"h":341,"s":45,"i":20,"a":100}hsi:{"h":342,"s":44,"i":13,"a":100}hsi:{"h":340,"s":46,"i":7,"a":100}hsi:{"h":0,"s":0,"i":0,"a":100}shade
hsp
hsp:{"h":340,"s":64,"p":60,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":340,"s":64,"p":53,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":340,"s":64,"p":47,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":340,"s":64,"p":40,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":340,"s":64,"p":33,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":341,"s":64,"p":27,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":340,"s":65,"p":20,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":341,"s":64,"p":13,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":339,"s":65,"p":7,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":0,"s":0,"p":0,"a":100,"pb":0.114,"pr":0.299}shade
rgb
rgb:{"r":238,"g":85,"b":136,"a":255,"bitDepth":8}rgb:{"r":212,"g":76,"b":121,"a":255,"bitDepth":8}rgb:{"r":185,"g":66,"b":106,"a":255,"bitDepth":8}rgb:{"r":159,"g":57,"b":91,"a":255,"bitDepth":8}rgb:{"r":132,"g":47,"b":76,"a":255,"bitDepth":8}rgb:{"r":106,"g":38,"b":60,"a":255,"bitDepth":8}rgb:{"r":79,"g":28,"b":45,"a":255,"bitDepth":8}rgb:{"r":53,"g":19,"b":30,"a":255,"bitDepth":8}rgb:{"r":26,"g":9,"b":15,"a":255,"bitDepth":8}rgb:{"r":0,"g":0,"b":0,"a":255,"bitDepth":8}shade
rgb2
rgb:{"r":238,"g":85,"b":136,"a":255,"bitDepth":8}rgb:{"r":212,"g":59,"b":110,"a":255,"bitDepth":8}rgb:{"r":185,"g":32,"b":83,"a":255,"bitDepth":8}rgb:{"r":159,"g":6,"b":57,"a":255,"bitDepth":8}rgb:{"r":132,"g":0,"b":30,"a":255,"bitDepth":8}rgb:{"r":106,"g":0,"b":4,"a":255,"bitDepth":8}rgb:{"r":79,"g":0,"b":0,"a":255,"bitDepth":8}rgb:{"r":53,"g":0,"b":0,"a":255,"bitDepth":8}rgb:{"r":26,"g":0,"b":0,"a":255,"bitDepth":8}rgb:{"r":0,"g":0,"b":0,"a":255,"bitDepth":8}shade
cmyk
cmyk:{"c":0,"m":64,"y":43,"k":7}cmyk:{"c":0,"m":64,"y":43,"k":26}cmyk:{"c":0,"m":65,"y":43,"k":44}cmyk:{"c":0,"m":64,"y":43,"k":58}cmyk:{"c":0,"m":64,"y":42,"k":71}cmyk:{"c":0,"m":64,"y":43,"k":82}cmyk:{"c":0,"m":65,"y":42,"k":90}cmyk:{"c":0,"m":67,"y":42,"k":95}cmyk:{"c":0,"m":67,"y":33,"k":99}cmyk:{"c":0,"m":0,"y":0,"k":100}shade
lab
lab:{"l":58,"a":63,"b":4}lab:{"l":52,"a":56,"b":4}lab:{"l":45,"a":49,"b":3}lab:{"l":39,"a":42,"b":3}lab:{"l":32,"a":35,"b":2}lab:{"l":26,"a":28,"b":2}lab:{"l":19,"a":21,"b":1}lab:{"l":13,"a":14,"b":1}lab:{"l":7,"a":7,"b":1}lab:{"l":0,"a":0,"b":0}shade
luv
luv:{"l":58,"u":102,"v":-7}luv:{"l":52,"u":91,"v":-6}luv:{"l":45,"u":79,"v":-5}luv:{"l":39,"u":67,"v":-5}luv:{"l":32,"u":56,"v":-4}luv:{"l":26,"u":45,"v":-3}luv:{"l":19,"u":34,"v":-2}luv:{"l":13,"u":22,"v":-2}luv:{"l":6,"u":11,"v":-1}luv:{"l":0,"u":0,"v":0}let scheme: Color.hex[] = Color.from('hex', '22aaee')
.scheme('shade', {
method: /* methods listed below */,
colors: 10
})
shade
hsl
hsl:{"h":200,"s":86,"l":53,"a":100}hsl:{"h":200,"s":86,"l":47,"a":100}hsl:{"h":200,"s":86,"l":41,"a":100}hsl:{"h":200,"s":86,"l":35,"a":100}hsl:{"h":200,"s":85,"l":30,"a":100}hsl:{"h":200,"s":85,"l":24,"a":100}hsl:{"h":200,"s":87,"l":18,"a":100}hsl:{"h":200,"s":87,"l":12,"a":100}hsl:{"h":201,"s":87,"l":6,"a":100}hsl:{"h":0,"s":0,"l":0,"a":100}shade
hsv
hsv:{"h":200,"s":86,"v":93,"a":100}hsv:{"h":200,"s":86,"v":83,"a":100}hsv:{"h":200,"s":86,"v":73,"a":100}hsv:{"h":200,"s":86,"v":62,"a":100}hsv:{"h":200,"s":86,"v":52,"a":100}hsv:{"h":200,"s":86,"v":42,"a":100}hsv:{"h":199,"s":86,"v":31,"a":100}hsv:{"h":200,"s":85,"v":21,"a":100}hsv:{"h":199,"s":85,"v":10,"a":100}hsv:{"h":0,"s":0,"v":0,"a":100}shade
hsi
hsi:{"h":199,"s":77,"i":58,"a":100}hsi:{"h":199,"s":77,"i":51,"a":100}hsi:{"h":199,"s":77,"i":45,"a":100}hsi:{"h":199,"s":77,"i":39,"a":100}hsi:{"h":199,"s":77,"i":32,"a":100}hsi:{"h":199,"s":77,"i":26,"a":100}hsi:{"h":198,"s":78,"i":19,"a":100}hsi:{"h":199,"s":76,"i":13,"a":100}hsi:{"h":198,"s":76,"i":6,"a":100}hsi:{"h":0,"s":0,"i":0,"a":100}shade
hsp
hsp:{"h":200,"s":86,"p":60,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":200,"s":86,"p":54,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":200,"s":86,"p":47,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":200,"s":86,"p":40,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":200,"s":86,"p":33,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":200,"s":86,"p":27,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":199,"s":86,"p":20,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":200,"s":85,"p":14,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":199,"s":85,"p":7,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":0,"s":0,"p":0,"a":100,"pb":0.114,"pr":0.299}shade
rgb
rgb:{"r":34,"g":170,"b":238,"a":255,"bitDepth":8}rgb:{"r":30,"g":151,"b":212,"a":255,"bitDepth":8}rgb:{"r":26,"g":132,"b":185,"a":255,"bitDepth":8}rgb:{"r":23,"g":113,"b":159,"a":255,"bitDepth":8}rgb:{"r":19,"g":94,"b":132,"a":255,"bitDepth":8}rgb:{"r":15,"g":76,"b":106,"a":255,"bitDepth":8}rgb:{"r":11,"g":57,"b":79,"a":255,"bitDepth":8}rgb:{"r":8,"g":38,"b":53,"a":255,"bitDepth":8}rgb:{"r":4,"g":19,"b":26,"a":255,"bitDepth":8}rgb:{"r":0,"g":0,"b":0,"a":255,"bitDepth":8}shade
rgb2
rgb:{"r":34,"g":170,"b":238,"a":255,"bitDepth":8}rgb:{"r":8,"g":144,"b":212,"a":255,"bitDepth":8}rgb:{"r":0,"g":117,"b":185,"a":255,"bitDepth":8}rgb:{"r":0,"g":91,"b":159,"a":255,"bitDepth":8}rgb:{"r":0,"g":64,"b":132,"a":255,"bitDepth":8}rgb:{"r":0,"g":38,"b":106,"a":255,"bitDepth":8}rgb:{"r":0,"g":11,"b":79,"a":255,"bitDepth":8}rgb:{"r":0,"g":0,"b":53,"a":255,"bitDepth":8}rgb:{"r":0,"g":0,"b":26,"a":255,"bitDepth":8}rgb:{"r":0,"g":0,"b":0,"a":255,"bitDepth":8}shade
cmyk
cmyk:{"c":86,"m":29,"y":0,"k":7}cmyk:{"c":86,"m":29,"y":0,"k":26}cmyk:{"c":85,"m":28,"y":0,"k":44}cmyk:{"c":86,"m":28,"y":0,"k":58}cmyk:{"c":86,"m":29,"y":0,"k":71}cmyk:{"c":85,"m":28,"y":0,"k":82}cmyk:{"c":85,"m":27,"y":0,"k":90}cmyk:{"c":83,"m":33,"y":0,"k":95}cmyk:{"c":100,"m":33,"y":0,"k":99}cmyk:{"c":0,"m":0,"y":0,"k":100}shade
lab
lab:{"l":66,"a":-11,"b":-44}lab:{"l":58,"a":-10,"b":-39}lab:{"l":51,"a":-8,"b":-34}lab:{"l":44,"a":-7,"b":-29}lab:{"l":37,"a":-6,"b":-24}lab:{"l":29,"a":-5,"b":-19}lab:{"l":22,"a":-3,"b":-15}lab:{"l":15,"a":-3,"b":-9}lab:{"l":7,"a":-2,"b":-5}lab:{"l":0,"a":0,"b":0}shade
luv
luv:{"l":66,"u":-42,"v":-69}luv:{"l":59,"u":-37,"v":-61}luv:{"l":51,"u":-33,"v":-53}luv:{"l":44,"u":-28,"v":-46}luv:{"l":37,"u":-23,"v":-38}luv:{"l":29,"u":-19,"v":-30}luv:{"l":22,"u":-14,"v":-23}luv:{"l":15,"u":-9,"v":-15}luv:{"l":7,"u":-5,"v":-8}luv:{"l":0,"u":0,"v":0}let scheme: Color.hex[] = Color.from('hex', 'ee5588')
.scheme('shade', {
method: /* methods listed below */,
colors: 10,
distance: 0.5
})
shade
hsl
hsl:{"h":340,"s":82,"l":63,"a":100}hsl:{"h":340,"s":81,"l":60,"a":100}hsl:{"h":340,"s":82,"l":56,"a":100}hsl:{"h":340,"s":82,"l":53,"a":100}hsl:{"h":340,"s":82,"l":49,"a":100}hsl:{"h":340,"s":82,"l":46,"a":100}hsl:{"h":340,"s":81,"l":42,"a":100}hsl:{"h":340,"s":82,"l":39,"a":100}hsl:{"h":340,"s":82,"l":35,"a":100}hsl:{"h":340,"s":81,"l":32,"a":100}shade
hsv
hsv:{"h":340,"s":64,"v":93,"a":100}hsv:{"h":340,"s":64,"v":88,"a":100}hsv:{"h":340,"s":64,"v":83,"a":100}hsv:{"h":340,"s":64,"v":78,"a":100}hsv:{"h":340,"s":64,"v":73,"a":100}hsv:{"h":340,"s":65,"v":67,"a":100}hsv:{"h":340,"s":64,"v":62,"a":100}hsv:{"h":340,"s":64,"v":57,"a":100}hsv:{"h":340,"s":64,"v":52,"a":100}hsv:{"h":340,"s":65,"v":47,"a":100}shade
hsi
hsi:{"h":341,"s":44,"i":60,"a":100}hsi:{"h":341,"s":45,"i":57,"a":100}hsi:{"h":341,"s":44,"i":53,"a":100}hsi:{"h":341,"s":44,"i":50,"a":100}hsi:{"h":341,"s":45,"i":47,"a":100}hsi:{"h":341,"s":45,"i":43,"a":100}hsi:{"h":341,"s":44,"i":40,"a":100}hsi:{"h":341,"s":44,"i":37,"a":100}hsi:{"h":340,"s":45,"i":33,"a":100}hsi:{"h":341,"s":44,"i":30,"a":100}shade
hsp
hsp:{"h":340,"s":64,"p":60,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":340,"s":64,"p":57,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":340,"s":64,"p":53,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":340,"s":64,"p":50,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":340,"s":64,"p":47,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":340,"s":65,"p":43,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":340,"s":64,"p":40,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":340,"s":64,"p":36,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":340,"s":64,"p":33,"a":100,"pb":0.114,"pr":0.299}hsp:{"h":340,"s":65,"p":30,"a":100,"pb":0.114,"pr":0.299}shade
rgb
rgb:{"r":238,"g":85,"b":136,"a":255,"bitDepth":8}rgb:{"r":225,"g":80,"b":128,"a":255,"bitDepth":8}rgb:{"r":212,"g":76,"b":121,"a":255,"bitDepth":8}rgb:{"r":198,"g":71,"b":113,"a":255,"bitDepth":8}rgb:{"r":185,"g":66,"b":106,"a":255,"bitDepth":8}rgb:{"r":172,"g":61,"b":98,"a":255,"bitDepth":8}rgb:{"r":159,"g":57,"b":91,"a":255,"bitDepth":8}rgb:{"r":145,"g":52,"b":83,"a":255,"bitDepth":8}rgb:{"r":132,"g":47,"b":76,"a":255,"bitDepth":8}rgb:{"r":119,"g":43,"b":68,"a":255,"bitDepth":8}shade
rgb2
rgb:{"r":238,"g":85,"b":136,"a":255,"bitDepth":8}rgb:{"r":225,"g":72,"b":123,"a":255,"bitDepth":8}rgb:{"r":212,"g":59,"b":110,"a":255,"bitDepth":8}rgb:{"r":198,"g":45,"b":96,"a":255,"bitDepth":8}rgb:{"r":185,"g":32,"b":83,"a":255,"bitDepth":8}rgb:{"r":172,"g":19,"b":70,"a":255,"bitDepth":8}rgb:{"r":159,"g":6,"b":57,"a":255,"bitDepth":8}rgb:{"r":145,"g":0,"b":43,"a":255,"bitDepth":8}rgb:{"r":132,"g":0,"b":30,"a":255,"bitDepth":8}rgb:{"r":119,"g":0,"b":17,"a":255,"bitDepth":8}shade
cmyk
cmyk:{"c":0,"m":64,"y":43,"k":7}cmyk:{"c":0,"m":64,"y":43,"k":17}cmyk:{"c":0,"m":64,"y":43,"k":26}cmyk:{"c":0,"m":64,"y":43,"k":35}cmyk:{"c":0,"m":65,"y":43,"k":44}cmyk:{"c":0,"m":65,"y":43,"k":51}cmyk:{"c":0,"m":64,"y":43,"k":58}cmyk:{"c":0,"m":64,"y":43,"k":65}cmyk:{"c":0,"m":64,"y":42,"k":71}cmyk:{"c":0,"m":65,"y":43,"k":76}shade
lab
lab:{"l":58,"a":63,"b":4}lab:{"l":55,"a":59,"b":4}lab:{"l":52,"a":56,"b":4}lab:{"l":49,"a":53,"b":4}lab:{"l":45,"a":49,"b":3}lab:{"l":42,"a":45,"b":3}lab:{"l":39,"a":42,"b":3}lab:{"l":36,"a":38,"b":3}lab:{"l":32,"a":35,"b":2}lab:{"l":29,"a":31,"b":2}shade
luv
luv:{"l":58,"u":102,"v":-7}luv:{"l":55,"u":96,"v":-6}luv:{"l":52,"u":91,"v":-6}luv:{"l":49,"u":84,"v":-6}luv:{"l":45,"u":79,"v":-5}luv:{"l":42,"u":73,"v":-5}luv:{"l":39,"u":67,"v":-5}luv:{"l":36,"u":62,"v":-4}luv:{"l":32,"u":56,"v":-4}luv:{"l":29,"u":51,"v":-3}let scheme: Color.hex[] = Color.from('hex', '22aaee')
.scheme('shade', {
method: /* methods listed below */,
colors: 10,
distance: 0.5
})