Convert Colors

Methods

hex2ciede(hex1, hex2) → {NumberCIEDE}

Source:

index.js, line 719

Return the CIEDE2000 difference between 2 HEX colors

Example

hex2ciede('#fff', '#000') // => 100

Parameters:

Name	Type	Description
`hex1`	StringHex
`hex2`	StringHex

Returns:

Type: NumberCIEDE

hex2contrast(hex1, hex2) → {NumberContrast}

Source:

index.js, line 834

Return the contrast ratio of 2 HEX colors

Example

rgb2contrast("#fff", '#000') // => 21

Parameters:

Name	Type	Description
`hex1`	StringHex
`hex2`	StringHex

Returns:

Type: NumberContrast

hex2hsl(hex) → {ArrayHSL}

Source:

index.js, line 545

Return an HSL color from a Hex color

Example

hex2hsl("#f00") // => [0, 100, 50]

Parameters:

Name	Type	Description
`hex`	StringHex

Returns:

Type: ArrayHSL

hex2hsv(hex) → {ArrayHSV}

Source:

index.js, line 558

Return an HSL color from a Hex color

Example

hex2hsv("#f00") // => [0, 100, 100]

Parameters:

Name	Type	Description
`hex`	StringHex

Returns:

Type: ArrayHSV

hex2hwb(hex) → {ArrayHWB}

Source:

index.js, line 571

Return an HWB color from a Hex color

Example

hex2hwb("#f00") // => [0, 0, 0]

Parameters:

Name	Type	Description
`hex`	StringHex

Returns:

Type: ArrayHWB

hex2lab(hex) → {ArrayLAB}

Source:

index.js, line 584

Return a CIE LAB color from a Hex color

Example

hex2lab("#f00") // => [54.29, 80.82, 69.88]

Parameters:

Name	Type	Description
`hex`	StringHex

Returns:

Type: ArrayLAB

hex2lch(hex) → {ArrayLCH}

Source:

index.js, line 597

Return a CIE LCH color from a Hex color

Example

hex2lch("#f00") // => [54.29, 106.84, 40.85]

Parameters:

Name	Type	Description
`hex`	StringHex

Returns:

Type: ArrayLCH

hex2rgb(hex) → {ArrayRGBA}

Source:

hex-rgb.js, line 1

Return an RGBA color from a Hex color.

Examples

hex2rgb("#f00") // => [100, 0, 0, 100]
hex2rgb("#f00f") // => [100, 0, 0, 100]

hex2rgb("#ff0000") // => [100, 0, 0, 100]
hex2rgb("#ff0000ff") // => [100, 0, 0, 100]

Parameters:

Name	Type	Description
`hex`	StringHex

Returns:

Type: ArrayRGBA

hex2xyz(hex) → {ArrayXYZ}

Source:

index.js, line 610

Return an XYZ color from a Hex color

Example

hex2xyz("#f00") // => [41.25, 21.27, 1.93]

Parameters:

Name	Type	Description
`hex`	StringHex

Returns:

Type: ArrayXYZ

hsl2ciede(hsl1, hsl2) → {NumberCIEDE}

Source:

index.js, line 733

Return the CIEDE2000 difference between 2 HSL colors

Example

hsl2ciede([0, 0, 100], [0, 0, 0]) // => 100

Parameters:

Name	Type	Description
`hsl1`	ArrayHSL
`hsl2`	ArrayHSL

Returns:

Type: NumberCIEDE

hsl2contrast(hsl1, hsl2) → {NumberContrast}

Source:

index.js, line 848

Return the contrast ratio of 2 HSL colors

Example

hsl2contrast([0, 0, 100], [0, 0, 0]) // => 21

Parameters:

Name	Type	Description
`hsl1`	ArrayHSL
`hsl2`	ArrayHSL

Returns:

Type: NumberContrast

hsl2hex(h, s, l) → {StringHex}

Source:

index.js, line 626

Return a Hex color from an HSL color

Example

hsl2hex(0, 100, 50) // => "#f00"

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`s`	Number	Saturation (0 - 100)
`l`	Number	Lightness (0 - 100)

Returns:

Type: StringHex

hsl2hsv(h, s, l) → {ArrayHSV}

Source:

hsl-hsv.js, line 1

Return an HSV color from an HSL color

Example

hsl2hsv(0, 100, 50)

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`s`	Number	Saturation (0 - 100)
`l`	Number	Lightness (0 - 100)

Returns:

Type: ArrayHSV

hsl2hwb(h, s, l) → {ArrayHWB}

Source:

index.js, line 115

Return an HWB color from an HSL color

Example

hsl2hwb(0, 0, 100) // => [0, 0, 0]

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`s`	Number	Saturation (0 - 100)
`l`	Number	Lightness (0 - 100)

Returns:

Type: ArrayHWB

hsl2lab(h, s, l) → {ArrayLAB}

Source:

index.js, line 136

Return a CIE LAB color from an HSL color

Example

hsl2lab(0, 100, 50) // => [54.29, 80.82, 69.88]

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`s`	Number	Saturation (0 - 100)
`l`	Number	Lightness (0 - 100)

Returns:

Type: ArrayLAB

hsl2lch(h, s, l) → {ArrayLCH}

Source:

index.js, line 178

Return a CIE LCH color from an HSL color

Example

hsl2lch(0, 100, 50) // => [54.29, 106.84, 40.85]

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`s`	Number	Saturation (0 - 100)
`l`	Number	Lightness (0 - 100)

Returns:

Type: ArrayLCH

hsl2rgb(h, s, l) → {ArrayRGB}

Source:

rgb-hsl.js, line 36

Return an RGB color from an HSL color

Example

hsl2rgb(0, 100, 50) // => [0, 100, 100]

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`s`	Number	Saturation (0 - 100)
`l`	Number	Lightness (0 - 100)

Returns:

Type: ArrayRGB

hsl2xyz(h, s, l) → {ArrayXYZ}

Source:

index.js, line 221

Return an XYZ color from an HSL color

Example

hsl2xyz(0, 100, 50) // => [41.25, 21.27, 1.93]

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`s`	Number	Saturation (0 - 100)
`l`	Number	Lightness (0 - 100)

Returns:

Type: ArrayXYZ

hsv2ciede(hsl1, hsl2) → {NumberCIEDE}

Source:

index.js, line 747

Return the CIEDE2000 difference between 2 HSV colors

Example

hsv2ciede([0, 0, 40], [0, 0, 0]) // => 100

Parameters:

Name	Type	Description
`hsl1`	ArrayHSV
`hsl2`	ArrayHSV

Returns:

Type: NumberCIEDE

hsv2contrast(hsv1, hsv2) → {NumberContrast}

Source:

index.js, line 862

Return the contrast ratio of 2 HSV colors

Example

hsv2contrast([0, 0, 100], [0, 0, 0]) // => 21

Parameters:

Name	Type	Description
`hsv1`	ArrayHSV
`hsv2`	ArrayHSV

Returns:

Type: NumberContrast

hsv2hex(h, s, v) → {StringHex}

Source:

index.js, line 641

Return a Hex color from an HSV color

Example

hsv2hex(0, 100, 100) // => "#f00"

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`s`	Number	Saturation (0 - 100)
`v`	Number	Value (0 - 100)

Returns:

Type: StringHex

hsv2hsl(h, s, v) → {ArrayHSL}

Source:

hsl-hsv.js, line 21

Return an HSL color from an HSV color

Example

hsv2hsl(0, 0, 0) // => [0, 100, 50]

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`s`	Number	Saturation (0 - 100)
`v`	Number	Value (0 - 100)

Returns:

Type: ArrayHSL

hsv2hwb(h, s, v) → {ArrayHWB}

Source:

hwb-hsv.js, line 24

Return an HWB color from an HSV color

Example

hsv2hwb(0, 100, 100) // => [0, 0, 0]

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`s`	Number	Saturation (0 - 100)
`v`	Number	Value (0 - 100)

Returns:

Type: ArrayHWB

hsv2lab(h, s, v) → {ArrayLAB}

Source:

index.js, line 383

Return a CIE LAB color from an HSV color

Example

hsv2lab(0, 100, 100) // => [54.29, 80.82, 69.88]

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`s`	Number	Saturation (0 - 100)
`v`	Number	Value (0 - 100)

Returns:

Type: ArrayLAB

hsv2lch(h, s, v) → {ArrayLCH}

Source:

index.js, line 424

Return a CIE LCH color from an HSV color

Example

hsv2lch(0, 100, 100) // => [54.29, 106.84, 40.85]

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`s`	Number	Saturation (0 - 100)
`v`	Number	Value (0 - 100)

Returns:

Type: ArrayLCH

hsv2rgb(h, s, v) → {ArrayRGB}

Source:

rgb-hsv.js, line 27

Return an RGB color from an HSV color

Example

hsv2rgb(100, 0, 0) // => [100, 0, 0]

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`s`	Number	Saturation (0 - 100)
`v`	Number	Value (0 - 100)

Returns:

Type: ArrayRGB

hsv2xyz(h, s, v) → {ArrayXYZ}

Source:

index.js, line 467

Return an XYZ color from an HSV color

Example

hsv2xyz(0, 100, 100) // => [41.25, 21.27, 1.93]

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`s`	Number	Saturation (0 - 100)
`v`	Number	Value (0 - 100)

Returns:

Type: ArrayXYZ

hwb2ciede(hwb1, hwb2) → {NumberCIEDE}

Source:

index.js, line 761

Return the CIEDE2000 difference between 2 HWB colors

Example

hwb2ciede([0, 0, 40], [0, 0, 0]) // => 100

Parameters:

Name	Type	Description
`hwb1`	ArrayHWB
`hwb2`	ArrayHWB

Returns:

Type: NumberCIEDE

hwb2contrast(hwb1, hwb2) → {NumberContrast}

Source:

index.js, line 876

Return the contrast ratio of 2 HWB colors

Example

hwb2contrast([0, 100, 0], [0, 0, 100]) // => 21

Parameters:

Name	Type	Description
`hwb1`	ArrayHWB
`hwb2`	ArrayHWB

Returns:

Type: NumberContrast

hwb2hex(h, w, b) → {StringHex}

Source:

index.js, line 656

Return a Hex color from an HWB color

Example

hwb2hex(0, 0, 0) // => "#f00"

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`w`	Number	Whiteness (0 - 100)
`b`	Number	Blackness (0 - 100)

Returns:

Type: StringHex

hwb2hsl(h, w, b) → {ArrayHSL}

Source:

index.js, line 97

Return an HSV color from an HWB color

Example

hwb2hsl(0, 0, 0) // => [0, 0, 100]

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`w`	Number	Whiteness (0 - 100)
`b`	Number	Blackness (0 - 100)

Returns:

Type: ArrayHSL

hwb2hsv(h, w, b) → {ArrayHSV}

Source:

hwb-hsv.js, line 1

Return an HSV color from an HWB color

Example

hwb2hsv(0, 0, 0) // => [0, 100, 100]

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`w`	Number	Whiteness (0 - 100)
`b`	Number	Blackness (0 - 100)

Returns:

Type: ArrayHSV

hwb2lab(h, w, b) → {ArrayLAB}

Source:

index.js, line 260

Return a CIE LAB color from an HWB color

Example

hwb2lab(0, 0, 0) // => [54.29, 80.82, 69.88]

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`w`	Number	Whiteness (0 - 100)
`b`	Number	Blackness (0 - 100)

Returns:

Type: ArrayLAB

hwb2lch(h, w, b) → {ArrayLCH}

Source:

index.js, line 301

Return a CIE LCH color from an HWB color

Example

hwb2lch(0, 0, 0) // => [54.29, 106.84, 40.85]

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`w`	Number	Whiteness (0 - 100)
`b`	Number	Blackness (0 - 100)

Returns:

Type: ArrayLCH

hwb2rgb(h, w, b) → {ArrayRGB}

Source:

rgb-hwb.js, line 27

Return an RGB color from an HWB color

Example

hwb2rgb(0, 0, 0) // => [100, 0, 0]

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`w`	Number	Whiteness (0 - 100)
`b`	Number	Blackness (0 - 100)

Returns:

Type: ArrayRGB

hwb2xyz(h, w, b) → {ArrayXYZ}

Source:

index.js, line 344

Return an XYZ color from an HWB color

Example

hwb2xyz(0, 0, 0) // => [41.25, 21.27, 1.93]

Parameters:

Name	Type	Description
`h`	Number	Hue Angle (0 - 360)
`w`	Number	Whiteness (0 - 100)
`b`	Number	Blackness (0 - 100)

Returns:

Type: ArrayXYZ

keyword2ciede(keyword1, keyword2) → {NumberCIEDE}

Source:

index.js, line 775

Return the CIEDE2000 difference between 2 keyword colors

Example

keyword2ciede('white', 'black') // => 100

Parameters:

Name	Type	Description
`keyword1`	StringKeyword
`keyword2`	StringKeyword

Returns:

Type: NumberCIEDE

keyword2contrast(keyword1, keyword2) → {NumberContrast}

Source:

index.js, line 890

Return the contrast ratio of 2 keyword colors

Example

keyword2contrast('white', 'black') // => 21

Parameters:

Name	Type	Description
`keyword1`	StringKeyword
`keyword2`	StringKeyword

Returns:

Type: NumberContrast

keyword2hex(keyword) → {String}

Source:

index.js, line 949

Return an RGB color from a keyword color

Example

keyword2hex('white') // => "#ffffff"

Parameters:

Name	Type	Description
`keyword`	StringKeyword	CSS Color Keyword

Returns:

Type: String

keyword2hsl() → {ArrayHSL}

Source:

index.js, line 962

Return an HSL color from a keyword color

Example

keyword2hsl('white') // => [0, 0, 100]

Parameters:

Type	Description
StringKeyword

Returns:

Type: ArrayHSL

keyword2hsv() → {ArrayHSV}

Source:

index.js, line 975

Return an HSV color from a keyword color

Example

keyword2hsv('white') // => [0, 0, 100]

Parameters:

Type	Description
StringKeyword

Returns:

Type: ArrayHSV

keyword2hwb() → {ArrayHWB}

Source:

index.js, line 988

Return an HWB color from a keyword color

Example

keyword2hwb('red') // => [0, 0, 0]

Parameters:

Type	Description
StringKeyword

Returns:

Type: ArrayHWB

keyword2lab() → {ArrayLAB}

Source:

index.js, line 1001

Return a CIE LAB color from a keyword color

Example

keyword2lab('red') // => [54.29, 80.82, 69.88]

Parameters:

Type	Description
StringKeyword

Returns:

Type: ArrayLAB

keyword2lch() → {ArrayLCH}

Source:

index.js, line 1014

Return a CIE LCH color from a keyword color

Example

keyword2lch('red') // => [54.29, 106.84, 40.85]

Parameters:

Type	Description
StringKeyword

Returns:

Type: ArrayLCH

keyword2lch() → {ArrayXYZ}

Source:

index.js, line 1027

Return an XYZ color from a keyword color

Example

keyword2lch('red') // => [41.25, 21.27, 1.93]

Parameters:

Type	Description
StringKeyword

Returns:

Type: ArrayXYZ

keyword2rgb(keyword) → {ArrayRGB}

Source:

keyword-rgb.js, line 1

Return an RGB color from a CSS keyword color

Example

keyword2rgb('red') // => [100, 0, 0]

Parameters:

Name	Type	Description
`keyword`	StringKeyword

Returns:

Type: ArrayRGB

lab2ciede(lab1, lab2) → {NumberCIEDE}

Source:

lab-ciede.js, line 6

Return the CIEDE2000 difference between 2 CIE LAB colors (International Commission on Illumination, Delta E).

Example

lab2ciede([97.14, -21.56, 94.48], [0, 0, 0]) // => 100

Parameters:

Name Type Description

lab1

Array

CIE LAB color

Properties

Name	Type	Description
`0`	Number	Lightness
`1`	Number	Red/Green Coordinate
`2`	Number	Yellow/Blue Coordinate

lab2

Array

CIE LAB color

Properties

Name	Type	Description
`0`	Number	Lightness
`1`	Number	Red/Green Coordinate
`2`	Number	Yellow/Blue Coordinate

Returns:

Type: NumberCIEDE

lab2contrast(lab1, lab2) → {NumberContrast}

Source:

index.js, line 904

Return the contrast ratio of 2 LAB colors

Example

lab2contrast([100, 0.003, -0.025], [0, 0, 0]) // => 21

Parameters:

Name	Type	Description
`lab1`	ArrayLAB
`lab2`	ArrayLAB

Returns:

Type: NumberContrast

lab2hsl(l, a, b, fopt) → {ArrayHSL}

Source:

index.js, line 155

Return a HSL color from a CIE LAB color

Example

lab2hsl(54.29, 80.82, 69.88) // => [0, 100, 50]

Parameters:

Name	Type	Attributes	Description
`l`	Number		CIE Lightness
`a`	Number		Red/Green Coordinate
`b`	Number		Yellow/Blue Coordinate
`f`	Number	<optional>	Hue Fallback (0 - 360)

Returns:

Type: ArrayHSL

lab2hsv(l, a, b) → {ArrayHSV}

Source:

index.js, line 402

Return an HSV color from a CIE LAB color

Example

lab2hsv(54.29, 80.82, 69.88) // => [0, 100, 100]

Parameters:

Name	Type	Description
`l`	Number	CIE Lightness
`a`	Number	Red/Green Coordinate
`b`	Number	Yellow/Blue Coordinate

Returns:

Type: ArrayHSV

lab2hwb(l, a, b) → {ArrayHWB}

Source:

index.js, line 279

Return an HWB color from a CIE LAB color

Example

lab2hwb(54.29, 80.82, 69.88) // => [0, 0, 0]

Parameters:

Name	Type	Description
`l`	Number	CIE Lightness
`a`	Number	Red/Green Coordinate
`b`	Number	Yellow/Blue Coordinate

Returns:

Type: ArrayHWB

lab2lch(l, a, b) → {ArrayLAB}

Source:

lab-lch.js, line 3

Return an LCH color from a LAB color

Example

lab2lch(54.29, 80.82, 69.88) // => [54.29, 106.84, 40.85]

Parameters:

Name	Type	Description
`l`	Number	CIE Lightness
`a`	Number	Red/Green Coordinate
`b`	Number	Yellow/Blue Coordinate

Returns:

Type: ArrayLAB

lab2rgb(l, a, b) → {ArrayRGBA}

Source:

index.js, line 35

Return an RGB color from a CIE LAB color

Example

lab2rgb(54.29, 80.82, 69.88) // => [100, 0, 0]

Parameters:

Name	Type	Description
`l`	Number	CIE Lightness
`a`	Number	Red/Green Coordinate
`b`	Number	Yellow/Blue Coordinate

Returns:

Type: ArrayRGBA

lab2xyz(l, a, b) → {ArrayXYZ}

Source:

lab-xyz.js, line 3

Return an XYZ color from a LAB color

Example

lab2xyz(54.29, 80.82, 69.88) // => 41.25, 21.27, 1.93

Parameters:

Name	Type	Description
`l`	Number	CIE Lightness
`a`	Number	Red/Green Coordinate
`b`	Number	Yellow/Blue Coordinate

Returns:

Type: ArrayXYZ

lch2ciede(lch1, lch2) → {NumberCIEDE}

Source:

index.js, line 789

Return the CIEDE2000 difference between 2 LCH colors

Example

lch2ciede([100, 0.03, -82.2], [0, 0, 0]) // => 100

Parameters:

Name	Type	Description
`lch1`	ArrayLCH
`lch2`	ArrayLCH

Returns:

Type: NumberCIEDE

lch2contrast(lch1, lch2) → {NumberContrast}

Source:

index.js, line 918

Return the contrast ratio of 2 LCH colors

Example

lch2contrast([100, 0.025, -82.2], [0, 0, 0]) // => 21

Parameters:

Name	Type	Description
`lch1`	ArrayLCH
`lch2`	ArrayLCH

Returns:

Type: NumberContrast

lch2hex(l, a, b) → {StringHex}

Source:

index.js, line 671

Return a Hex color from a CIE LAB color

Example

lch2hex(54.29, 80.82, 69.88) // => "#f00"

Parameters:

Name	Type	Description
`l`	Number	CIE Lightness
`a`	Number	Red/Green Coordinate
`b`	Number	Yellow/Blue Coordinate

Returns:

Type: StringHex

lch2hex(l, c, h) → {StringHex}

Source:

index.js, line 686

Return a Hex color from a CIE LCH color

Example

lch2hex(54.29, 106.84, 40.85) // => "#f00"

Parameters:

Name	Type	Description
`l`	Number	CIE Lightness
`c`	Number	CIE Chroma
`h`	Number	CIE Hue Angle

Returns:

Type: StringHex

lch2hsl(l, c, h) → {ArrayLCH}

Source:

index.js, line 198

Return an HSL from a CIE LCH color

Example

lch2hsl(54.29, 106.84, 40.85) // => [0, 100, 50]

Parameters:

Name	Type	Description
`l`	Number	CIE Lightness
`c`	Number	CIE Chroma
`h`	Number	CIE Hue Angle

Returns:

Type: ArrayLCH

lch2hsv(l, c, h) → {ArrayHSV}

Source:

index.js, line 444

Return an HSV color from a CIE LCH color

Example

lch2hsv(54.29, 106.84, 40.85) // => [0, 100, 100]

Parameters:

Name	Type	Description
`l`	Number	CIE Lightness
`c`	Number	CIE Chroma
`h`	Number	CIE Hue Angle

Returns:

Type: ArrayHSV

lch2hwb(l, c, h) → {ArrayLCH}

Source:

index.js, line 321

Return an HWB color from a CIE LCH color

Example

lch2hwb(54.29, 106.84, 40.85) // => [0, 0, 0]

Parameters:

Name	Type	Description
`l`	Number	CIE Lightness
`c`	Number	CIE Chroma
`h`	Number	CIE Hue Angle

Returns:

Type: ArrayLCH

lch2lab(l, c, h) → {ArrayLCH}

Source:

lab-lch.js, line 25

Return a LAB color from an LCH color

Example

lch2lab(54.29, 106.84, 40.85) // => [54.29, 80.82, 69.88]

Parameters:

Name	Type	Description
`l`	Number	CIE Lightness
`c`	Number	CIE Chroma
`h`	Number	CIE Hue Angle

Returns:

Type: ArrayLCH

lch2rgb(l, c, h) → {ArrayRGBA}

Source:

index.js, line 75

Return an RGB color from a CIE LCH color

Example

lch2rgb(54.29, 106.84, 40.85) // => [100, 0, 0]

Parameters:

Name	Type	Description
`l`	Number	CIE Lightness
`c`	Number	CIE Chroma
`h`	Number	CIE Hue

Returns:

Type: ArrayRGBA

lch2xyz(l, c, h) → {ArrayXYZ}

Source:

index.js, line 524

Return an XYZ color from a CIE LCH color

Example

lch2xyz(54.29, 106.84, 40.85) // => [41.25, 21.27, 1.93]

Parameters:

Name	Type	Description
`l`	Number	CIE Lightness
`c`	Number	CIE Chroma
`h`	Number	CIE Hue Angle

Returns:

Type: ArrayXYZ

rgb2ciede(rgb1, rgb2) → {NumberCIEDE}

Source:

index.js, line 803

Return the CIEDE2000 difference between 2 RGB colors

Example

rgb2ciede([100, 100, 100], [0, 0, 0]) // => 100

Parameters:

Name	Type	Description
`rgb1`	ArrayRGB
`rgb2`	ArrayRGB

Returns:

Type: NumberCIEDE

rgb2contrast(rgb1, rgb2) → {NumberContrast}

Source:

rgb-contrast.js, line 3

Return the contrast ratio of of RGB colors

Example

rgb2contrast([100, 0, 0], [0, 0, 0]) // => 5.252

Parameters:

Name	Type	Description
`rgb1`	ArrayRGB	RGB Color Array
`rgb2`	ArrayRGB	RGB Color Array

Returns:

Type: NumberContrast

rgb2hex(r, g, b) → {StringHex}

Source:

hex-rgb.js, line 30

Return a HEX color from an RGB color

Example

rgb2hex(100, 0, 0) // => "#ff0000"

Parameters:

Name	Type	Description
`r`	Number	Red (0 - 100)
`g`	Number	Green (0 - 100)
`b`	Number	Blue (0 - 100)

Returns:

Type: StringHex

rgb2hsl(r, g, b, fopt) → {ArrayHSL}

Source:

rgb-hsl.js, line 3

Return a HSL color from an RGB color

Example

rgb2hsl(0, 100, 100) // => [0, 100, 50]

Parameters:

Name	Type	Attributes	Description
`r`	Number		red (0 - 100)
`g`	Number		green (0 - 100)
`b`	Number		blue (0 - 100)
`f`	Number	<optional>	Hue Fallback (0 - 360)

Returns:

Type: ArrayHSL

rgb2hsv(h, s, v, fopt) → {ArrayHSV}

Source:

rgb-hsv.js, line 3

Return an HSV color from an RGB color

Example

rgb2hsv(100, 0, 0) // => [0, 100, 100]

Parameters:

Name	Type	Attributes	Description
`h`	Number		Hue Angle (0 - 360)
`s`	Number		Saturation (0 - 100)
`v`	Number		Value (0 - 100)
`f`	Number	<optional>	Hue Fallback (0 - 360)

Returns:

Type: ArrayHSV

rgb2hwb(r, g, b, f) → {ArrayHWB}

Source:

rgb-hwb.js, line 4

Return an HWB color from an RGB color

Example

rgb2hwb(100, 0, 0) // => [0, 0, 0]

Parameters:

Name	Type	Description
`r`	Number	Red (0 - 100)
`g`	Number	Green (0 - 100)
`b`	Number	Blue (0 - 100)
`f`	Number	Hue Fallback (0 - 360)

Returns:

Type: ArrayHWB

rgb2lab(r, g, b) → {ArrayLAB}

Source:

index.js, line 17

Return a CIE LAB color from an RGB color

Example

rgb2lab(100, 0, 0) // => [54.29, 80.82, 69.88]

Parameters:

Name	Type	Description
`r`	Number	Red (0 - 100)
`g`	Number	Green (0 - 100)
`b`	Number	Blue (0 - 100)

Returns:

Type: ArrayLAB

rgb2lch(r, g, b) → {ArrayLCH}

Source:

index.js, line 56

Return a CIE LAB color from an RGB color

Example

rgb2lch(100, 0, 0) // => [54.29, 106.84, 40.85]

Parameters:

Name	Type	Description
`r`	Number	Red (0 - 100)
`g`	Number	Green (0 - 100)
`b`	Number	Blue (0 - 100)

Returns:

Type: ArrayLCH

rgb2xyz(r, g, b) → {ArrayXYZ}

Source:

rgb-xyz.js, line 3

Return an XYZ color from an RGB color

Example

rgb2xyz(100, 0, 0) // => [41.25, 21.27, 1.93]

Parameters:

Name	Type	Description
`r`	Number	Red (0 - 100)
`g`	Number	Green (0 - 100)
`b`	Number	Blue (0 - 100)

Returns:

Type: ArrayXYZ

xyz2ciede(xyz1, xyz2) → {NumberCIEDE}

Source:

index.js, line 817

Return the CIEDE2000 difference between 2 XYZ colors

Example

xyz2ciede([95.05, 100, 108.88], [0, 0, 0]) // => 100

Parameters:

Name	Type	Description
`xyz1`	ArrayXYZ
`xyz2`	ArrayXYZ

Returns:

Type: NumberCIEDE

xyz2contrast(xyz1, xyz2) → {NumberContrast}

Source:

index.js, line 932

Return the contrast ratio of 2 XYZ colors

Example

xyz2contrast([95.05, 100, 108.88], [0, 0, 0]) // => 21

Parameters:

Name	Type	Description
`xyz1`	ArrayXYZ
`xyz2`	ArrayXYZ

Returns:

Type: NumberContrast

xyz2hex(x, y, z) → {StringHex}

Source:

index.js, line 701

Return a Hex color from an XYZ color

Example

xyz2hex(41.25, 21.27, 1.93) // => "#f00"

Parameters:

Name	Type	Description
`x`	Number	Chromaticity of X
`y`	Number	Chromaticity of Y
`z`	Number	Chromaticity of Z

Returns:

Type: StringHex

xyz2hsl(x, y, z) → {ArrayHSL}

Source:

index.js, line 239

Return an HSL color from an XYZ color

Example

xyz2hsl(0, 100, 50) // => [41.25, 21.27, 1.93]

Parameters:

Name	Type	Description
`x`	Number	Chromaticity of X
`y`	Number	Chromaticity of Y
`z`	Number	Chromaticity of Z

Returns:

Type: ArrayHSL

xyz2hsv(x, y, z) → {ArrayHSV}

Source:

index.js, line 485

Return an XYZ color from an HSV color

Example

xyz2hsv(41.25, 21.27, 1.93) // => [0, 100, 100]

Parameters:

Name	Type	Description
`x`	Number	Chromaticity of X
`y`	Number	Chromaticity of Y
`z`	Number	Chromaticity of Z

Returns:

Type: ArrayHSV

xyz2hwb(x, y, z) → {ArrayXYZ}

Source:

index.js, line 362

Return an HWB color from an XYZ color

Example

xyz2hwb(0, 0, 0) // => [41.25, 21.27, 1.93]

Parameters:

Name	Type	Description
`x`	Number	Chromaticity of X
`y`	Number	Chromaticity of Y
`z`	Number	Chromaticity of Z

Returns:

Type: ArrayXYZ

xyz2lab(x, y, z) → {ArrayLAB}

Source:

lab-xyz.js, line 44

Return an LAB color from a XYZ color

Example

xyz2lab(41.25, 21.27, 1.93) // => [54.29, 80.82, 69.88]

Parameters:

Name	Type	Description
`x`	Number	Chromaticity of X
`y`	Number	Chromaticity of Y
`z`	Number	Chromaticity of Z

Returns:

Type: ArrayLAB

xyz2lch(x, y, z) → {ArrayLCH}

Source:

index.js, line 506

Return a CIE LCH color from an XYZ color

Example

xyz2lch(41.25, 21.27, 1.93) // => [54.29, 106.84, 40.85]

Parameters:

Name	Type	Description
`x`	Number	Chromaticity of X
`y`	Number	Chromaticity of Y
`z`	Number	Chromaticity of Z

Returns:

Type: ArrayLCH

xyz2rgb(x, y, z) → {ArrayRGB}

Source:

rgb-xyz.js, line 30

Return an XYZ color from an RGB color

Example

xyz2rgb(41.25, 21.27, 1.93) // => [100, 0, 0]

Parameters:

Name	Type	Description
`x`	Number	Chromaticity of X
`y`	Number	Chromaticity of Y
`z`	Number	Chromaticity of Z

Returns:

Type: ArrayRGB

Type Definitions

ArrayHSL

Source:

index.js, line 1152

Properties:

Name	Type	Description
`0`	Number	Hue Angle (0 - 360)
`1`	Number	Saturation (0 - 100)
`2`	Number	Lightness (0 - 100)

An array of hue, saturation, and lightness channels.

Type:

Array

ArrayHSV

Source:

index.js, line 1159

Properties:

Name	Type	Description
`0`	Number	Hue Angle (0 - 360)
`1`	Number	Saturation (0 - 100)
`2`	Number	Value (0 - 100)

An array of hue, saturation, and value channels.

Type:

Array

ArrayHWB

Source:

index.js, line 1180

Properties:

Name	Type	Description
`0`	Number	Hue Angle (0 - 360)
`1`	Number	Whiteness (0 - 100)
`2`	Number	Blackness (0 - 100)

An array of hue, whiteness, and blackness channels.

Type:

Array

ArrayLAB

Source:

index.js, line 1166

Properties:

Name	Type	Description
`0`	Number	CIE Lightness
`1`	Number	Red/Green Coordinate
`2`	Number	Yellow/Blue Coordinate

An array of CIELAB lightness, red/green, and yellow/blue.

Type:

Array

ArrayLCH

Source:

index.js, line 1173

Properties:

Name	Type	Description
`0`	Number	CIE Lightness
`1`	Number	CIE Chroma
`2`	Number	CIE Hue

An array of CIELAB lightness, chroma, and hue.

Type:

Array

ArrayRGB

Source:

index.js, line 1136

Properties:

Name	Type	Description
`0`	Number	Red (0 - 100)
`1`	Number	Green (0 - 100)
`2`	Number	Blue (0 - 100)

An array of red, green, and blue channels.

Type:

Array

ArrayRGBA

Source:

index.js, line 1144

Properties:

Name	Type	Description
`0`	Number	Red (0 - 100)
`1`	Number	Green (0 - 100)
`2`	Number	Blue (0 - 100)
`3`	Number	Alpha (0 - 100)

An array of red, green, blue, and alpha channels.

Type:

Array

ArrayXYZ

Source:

index.js, line 1187

Properties:

Name	Type	Description
`0`	Number	X Chromacity
`1`	Number	Y Chromacity
`2`	Number	Z Chromacity

An array of CIELAB chromacity.

Type:

Array

Examples

[95.05, 100, 108.88]

[0, 0, 0]

NumberCIEDE

Source:

index.js, line 1226

A CIEDE2000 difference between 2 colors (0 - 100)

Type:

Number

Examples

NumberContrast

Source:

index.js, line 1218

A contrast ratio of the colors (0 - 21)

Type:

Number

Examples

StringHex

Source:

index.js, line 1198

A string representing the 3, 4, 6, or 8 digit hexidecimal color.

Type:

String

Examples

"#f00"
"#f00f"

"#ff0000"
"#ff0000ff"

StringKeyword

Source:

index.js, line 1208

A case-insensitive string identifier that represents a specific color.

Type:

String

Examples

"#f00"
"#f00f"

"#ff0000"
"#ff0000ff"

Global

Methods

hex2ciede(hex1, hex2) → {NumberCIEDE}

Example

Parameters:

Returns:

hex2contrast(hex1, hex2) → {NumberContrast}

Example

Parameters:

Returns:

hex2hsl(hex) → {ArrayHSL}

Example

Parameters:

Returns:

hex2hsv(hex) → {ArrayHSV}

Example

Parameters:

Returns:

hex2hwb(hex) → {ArrayHWB}

Example

Parameters:

Returns:

hex2lab(hex) → {ArrayLAB}

Example

Parameters:

Returns:

hex2lch(hex) → {ArrayLCH}

Example

Parameters:

Returns:

hex2rgb(hex) → {ArrayRGBA}

Examples

Parameters:

Returns:

hex2xyz(hex) → {ArrayXYZ}

Example

Parameters:

Returns:

hsl2ciede(hsl1, hsl2) → {NumberCIEDE}

Example

Parameters:

Returns:

hsl2contrast(hsl1, hsl2) → {NumberContrast}

Example

Parameters:

Returns:

hsl2hex(h, s, l) → {StringHex}

Example

Parameters:

Returns:

hsl2hsv(h, s, l) → {ArrayHSV}

Example

Parameters:

Returns:

hsl2hwb(h, s, l) → {ArrayHWB}

Example

Parameters:

Returns:

hsl2lab(h, s, l) → {ArrayLAB}

Example

Parameters:

Returns:

hsl2lch(h, s, l) → {ArrayLCH}

Example

Parameters:

Returns:

hsl2rgb(h, s, l) → {ArrayRGB}

Example

Parameters:

Returns:

hsl2xyz(h, s, l) → {ArrayXYZ}

Example

Parameters:

Returns:

hsv2ciede(hsl1, hsl2) → {NumberCIEDE}

Example

Parameters:

Returns:

hsv2contrast(hsv1, hsv2) → {NumberContrast}

Example