Supported Color Spaces • Color.js

Adobe® 98 RGB compatible

src/spaces/a98rgb.js

Another wide gamut RGB color space, encompassed roughly 50% of visible colors, and popular in digital photography. The name Adobe® (1998) RGB' is trademarked, but a colorspace which is 100% identical can be described as compatible` as long as it uses a different name.

Base: Linear Adobe® 98 RGB compatible
White point:: D65
Coordinates:: Id Name Ref. range

r Red 0 – 1

g Green 0 – 1

b Blue 0 – 1

Id	Name	Ref. range
r	Red	0 – 1
g	Green	0 – 1
b	Blue	0 – 1

let color = new Color("a98rgb", [0.77, 0.81, 0.77]);
color.a98rgb.r = 0.5;
color.a98rgb.g = 0.5;
color.a98rgb.b = 0.5;
color.toString();

Learn more about Adobe® 98 RGB compatible

Linear Adobe® 98 RGB compatible

src/spaces/a98rgb-linear.js

Base: XYZ D65
White point:: D65
Coordinates:: Id Name Ref. range

r Red 0 – 1

g Green 0 – 1

b Blue 0 – 1

Id	Name	Ref. range
r	Red	0 – 1
g	Green	0 – 1
b	Blue	0 – 1

let color = new Color("a98rgb-linear", [0.68, 0.05, 0.47000000000000003]);
color.a98rgb_linear.r = 0.5;
color.a98rgb_linear.g = 0.5;
color.a98rgb_linear.b = 0.5;
color.toString();

ACEScc

src/spaces/acescc.js

Academy Color Encoding System, using the wide gamut but physically realizable AP1 primaries and Logarithmic Encoding. Used for color grading.

Base: ACEScg
White point:: ACES
Coordinates:: Id Name Ref. range

r Red -0.358 – 1.468

g Green -0.358 – 1.468

b Blue -0.358 – 1.468

Id	Name	Ref. range
r	Red	-0.358 – 1.468
g	Green	-0.358 – 1.468
b	Blue	-0.358 – 1.468

let color = new Color("acescc", [0.7617131700000002, -0.28828683, 0.88171317]);
color.acescc.r = 0.555;
color.acescc.g = 0.555;
color.acescc.b = 0.555;
color.toString();

Learn more about ACEScc

ACEScg

src/spaces/acescg.js

Scene-referred Academy Color Encoding System, using the wide gamut but physically realizable AP1 primaries and linear-light encoding. Used for physical rendering.

Base: XYZ D65
White point:: ACES
Coordinates:: Id Name Ref. range

r Red 0 – 65,504

g Green 0 – 65,504

b Blue 0 – 65,504

Id	Name	Ref. range
r	Red	0 – 65,504
g	Green	0 – 65,504
b	Blue	0 – 65,504

let color = new Color("acescg", [16200, 54000, 38400]);
color.acescg.r = 32800;
color.acescg.g = 32800;
color.acescg.b = 32800;
color.toString();

Learn more about ACEScg

CAM16-JMh

src/spaces/cam16-jmh.js

An improved and simplified development from the earlier CIECAM02 Color Appearance Model, CAM16 provides three perceptual attributes: lightness J, colorfulness M and hue quadrature h. The default viewing conditions are: D65 white point, adapting luminance of 64 lux (4 cd/m²), average surround and less than full chromatic adaptation. This does mean that what other color models consider to be achromatic colors may have a non-zero colorfulness (M).

Base: XYZ D65
White point:: D65
Coordinates:: Id Name Ref. range

j J 0 – 100

m Colorfulness 0 – 105

h Hue 0 – 360

Id	Name	Ref. range
j	J	0 – 100
m	Colorfulness	0 – 105
h	Hue	0 – 360

let color = new Color("cam16-jmh", [52, 28, 210]);
color.cam16_jmh.j = 50;
color.cam16_jmh.m = 52.5;
color.cam16_jmh.h = 180;
color.toString();

Learn more about CAM16-JMh

HCT

src/spaces/hct.js

Base: XYZ D65
White point:: D65
Coordinates:: Id Name Ref. range

h Hue 0 – 360

c Colorfulness 0 – 145

t Tone 0 – 100

Id	Name	Ref. range
h	Hue	0 – 360
c	Colorfulness	0 – 145
t	Tone	0 – 100

let color = new Color("hct", [30, 127, 99]);
color.hct.h = 180;
color.hct.c = 72.5;
color.hct.t = 50;
color.toString();

HPLuv

src/spaces/hpluv.js

The HPLuv color space emphasizes perceptual uniformity specifically in its lightness component. HPLuv ensures that changes in lightness are consistently perceived by the human eye, regardless of the hue or saturation of the color. The resulting palette is a subset of sRGB and the colors are mainly pastel.

Base: LChuv
White point:: D65
Coordinates:: Id Name Ref. range

h Hue 0 – 360

s Saturation 0 – 100

l Lightness 0 – 100

Id	Name	Ref. range
h	Hue	0 – 360
s	Saturation	0 – 100
l	Lightness	0 – 100

let color = new Color("hpluv", [220, 31, 40]);
color.hpluv.h = 180;
color.hpluv.s = 50;
color.hpluv.l = 50;
color.toString();

Learn more about HPLuv

HSL

src/spaces/hsl.js

Polar transformation of sRGB, supported as early as CSS Color Level 3. Beware the perceptually non-uniform hue, and don't compare the lightness of colors with different hue.

Base: sRGB
White point:: D65
Coordinates:: Id Name Ref. range

h Hue 0 – 360

s Saturation 0 – 100

l Lightness 0 – 100

Id	Name	Ref. range
h	Hue	0 – 360
s	Saturation	0 – 100
l	Lightness	0 – 100

let color = new Color("hsl", [327, 72, 29]);
color.hsl.h = 180;
color.hsl.s = 50;
color.hsl.l = 50;
color.toString();

Learn more about HSL

HSLuv

src/spaces/hsluv.js

The HSLuv color space is a perceptually uniform adaptation of the traditional HSL (Hue, Saturation, Lightness) color model. Engineered upon the foundations of the CIELUV color space, HSLuv ensures that colors that appear equally spaced in its representation also present consistent perceptual differences to the human observer. This results in a color space where changes in hue, saturation, or lightness produce predictable and coherent visual outcomes, addressing inconsistencies and unpredictable color shifts often found in standard HSL.

Base: LChuv
White point:: D65
Coordinates:: Id Name Ref. range

h Hue 0 – 360

s Saturation 0 – 100

l Lightness 0 – 100

Id	Name	Ref. range
h	Hue	0 – 360
s	Saturation	0 – 100
l	Lightness	0 – 100

let color = new Color("hsluv", [24, 77, 4]);
color.hsluv.h = 180;
color.hsluv.s = 50;
color.hsluv.l = 50;
color.toString();

Learn more about HSLuv

HSV

src/spaces/hsv.js

Yet another polar transformation of sRGB, supported in, for example, Adobe CS software.

Base: sRGB
White point:: D65
Coordinates:: Id Name Ref. range

h Hue 0 – 360

s Saturation 0 – 100

v Value 0 – 100

Id	Name	Ref. range
h	Hue	0 – 360
s	Saturation	0 – 100
v	Value	0 – 100

let color = new Color("hsv", [192, 36, 2]);
color.hsv.h = 180;
color.hsv.s = 50;
color.hsv.v = 50;
color.toString();

Learn more about HSV

HWB

src/spaces/hwb.js

Another polar transformation of sRGB with hue, whiteness, and blackness coordinates.

Base: HSV
White point:: D65
Coordinates:: Id Name Ref. range

h Hue 0 – 360

w Whiteness 0 – 100

b Blackness 0 – 100

Id	Name	Ref. range
h	Hue	0 – 360
w	Whiteness	0 – 100
b	Blackness	0 – 100

let color = new Color("hwb", [43, 18, 93]);
color.hwb.h = 180;
color.hwb.w = 50;
color.hwb.b = 50;
color.toString();

Learn more about HWB

ICTCP

src/spaces/ictcp.js

A color space that improves on Lab, with better perceptual uniformity and also supports High Dynamic Range (HDR), or very bright colors brighter than a paper white. The transfer function is Dolby PQ, which is defined in REC.2100 and used for HDR UHDTV.

Base: Absolute XYZ D65
White point:: D65
Coordinates:: Id Name Ref. range

i I 0 – 1

ct CT -0.5 – 0.5

cp CP -0.5 – 0.5

Id	Name	Ref. range
i	I	0 – 1
ct	CT	-0.5 – 0.5
cp	CP	-0.5 – 0.5

let color = new Color("ictcp", [0.56, -0.46, 0.39]);
color.ictcp.i = 0.5;
color.ictcp.ct = 0;
color.ictcp.cp = 0;
color.toString();

Learn more about ICTCP

JzCzHz

src/spaces/jzczhz.js

Polar form of Jzazbz.

Base: Jzazbz
White point:: D65
Coordinates:: Id Name Ref. range

jz Jz 0 – 1

cz Chroma 0 – 1

hz Hue 0 – 360

Id	Name	Ref. range
jz	Jz	0 – 1
cz	Chroma	0 – 1
hz	Hue	0 – 360

let color = new Color("jzczhz", [0.2, 0.9500000000000001, 9]);
color.jzczhz.jz = 0.5;
color.jzczhz.cz = 0.5;
color.jzczhz.hz = 180;
color.toString();

Learn more about JzCzHz

Jzazbz

src/spaces/jzazbz.js

A color space that improves on Lab, with much better perceptual uniformity, and also supports High Dynamic Range (HDR), or very bright colors brighter than a paper white. The transfer function is derived from Dolby PQ, which is defined in REC.2100 and used for HDR UHDTV.

Base: Absolute XYZ D65
White point:: D65
Coordinates:: Id Name Ref. range

jz Jz 0 – 1

az -0.5 – 0.5

bz -0.5 – 0.5

Id	Name	Ref. range
jz	Jz	0 – 1
az	-0.5 – 0.5
bz	-0.5 – 0.5

let color = new Color("jzazbz", [0.2, 0.10999999999999999, 0.33000000000000007]);
color.jzazbz.jz = 0.5;
color.jzazbz.az = 0;
color.jzazbz.bz = 0;
color.toString();

Learn more about Jzazbz

LCH

src/spaces/lch.js

LCH is the polar form of Lab. Instead of juggling a and b, you specify a Hue angle (starting from the positive a axis) and a Chroma, or colorfulness, which is zero for neutral greys and increases as a color becomes more intensely colorful.

Base: Lab
White point:: D50
Coordinates:: Id Name Ref. range

l Lightness 0 – 100

c Chroma 0 – 150

h Hue 0 – 360

Id	Name	Ref. range
l	Lightness	0 – 100
c	Chroma	0 – 150
h	Hue	0 – 360

let color = new Color("lch", [61, 82, 240]);
color.lch.l = 50;
color.lch.c = 75;
color.lch.h = 180;
color.toString();

Learn more about LCH

LChuv

src/spaces/lchuv.js

The polar (Hue, Chroma) form of CIE Luv.

Base: Luv
White point:: D65
Coordinates:: Id Name Ref. range

l Lightness 0 – 100

c Chroma 0 – 220

h Hue 0 – 360

Id	Name	Ref. range
l	Lightness	0 – 100
c	Chroma	0 – 220
h	Hue	0 – 360

let color = new Color("lchuv", [38, 70, 244]);
color.lchuv.l = 50;
color.lchuv.c = 110;
color.lchuv.h = 180;
color.toString();

Learn more about LChuv

Lab

src/spaces/lab.js

A CIE color space with fairly good perceptually uniformity. Lab has a central Lightness axis (black at 0, white at 100, mid-grey at 50) and two opponent color axes. The a axis has pinkish reds in the positive direction and the complementary bluish-greens in the negative direction. The b axis has yellows in the positive direction and the complementary blue-violets in the negative direction. The geometric distance between to points in Lab is a good first approximation to how different the two colors look. Commercial color-measuring instruments report values in Lab, and it is used as an intermediate space for gamut mapping and colorspace interconversion.

Base: XYZ D50
White point:: D50
Coordinates:: Id Name Ref. range

l Lightness 0 – 100

a -125 – 125

b -125 – 125

Id	Name	Ref. range
l	Lightness	0 – 100
a	-125 – 125
b	-125 – 125

let color = new Color("lab", [53, -39, 66]);
color.lab.l = 50;
color.lab.a = 0;
color.lab.b = 0;
color.toString();

Learn more about Lab

Lab D65

src/spaces/lab-d65.js

Base: XYZ D65
White point:: D65
Coordinates:: Id Name Ref. range

l Lightness 0 – 100

a -125 – 125

b -125 – 125

Id	Name	Ref. range
l	Lightness	0 – 100
a	-125 – 125
b	-125 – 125

let color = new Color("lab-d65", [95, -73, -96]);
color.lab_d65.l = 50;
color.lab_d65.a = 0;
color.lab_d65.b = 0;
color.toString();

Luv

src/spaces/luv.js

CIELUV is a color space developed in 1976 for perceptually uniform color representation, ideal for practical applications like digital displays. It's derived from the CIE 1931 XYZ space and includes L* for luminance, and u*, v* for chromaticity, capturing green–red and blue–yellow dimensions.

Base: XYZ D65
White point:: D65
Coordinates:: Id Name Ref. range

l Lightness 0 – 100

u -215 – 215

v -215 – 215

Id	Name	Ref. range
l	Lightness	0 – 100
u	-215 – 215
v	-215 – 215

let color = new Color("luv", [0, -23, -93]);
color.luv.l = 50;
color.luv.u = 0;
color.luv.v = 0;
color.toString();

Learn more about Luv

OKLCh

src/spaces/oklch.js

The polar (Hue, Chroma) form of OK Lab

Base: Oklab
White point:: D65
Coordinates:: Id Name Ref. range

l Lightness 0 – 1

c Chroma 0 – 0.4

h Hue 0 – 360

Id	Name	Ref. range
l	Lightness	0 – 1
c	Chroma	0 – 0.4
h	Hue	0 – 360

let color = new Color("oklch", [0.92, 0.098, 340]);
color.oklch.l = 0.5;
color.oklch.c = 0.2;
color.oklch.h = 180;
color.toString();

Learn more about OKLCh

Oklab

src/spaces/oklab.js

An improved version of CIE Lab, with improved hue linearity and orthogonality; derived from optimized LMS basis functions. Cube root transfer function.

Base: XYZ D65
White point:: D65
Coordinates:: Id Name Ref. range

l Lightness 0 – 1

a -0.4 – 0.4

b -0.4 – 0.4

Id	Name	Ref. range
l	Lightness	0 – 1
a	-0.4 – 0.4
b	-0.4 – 0.4

let color = new Color("oklab", [0.15, -0.03500000000000003, 0.28800000000000003]);
color.oklab.l = 0.5;
color.oklab.a = 0;
color.oklab.b = 0;
color.toString();

Learn more about Oklab

Oklrch

src/spaces/oklrch.js

Base: Oklrab
White point:: D65
Coordinates:: Id Name Ref. range

l Lightness 0 – 1

c Chroma 0 – 0.4

h Hue 0 – 360

Id	Name	Ref. range
l	Lightness	0 – 1
c	Chroma	0 – 0.4
h	Hue	0 – 360

let color = new Color("oklrch", [0.64, 0.308, 292]);
color.oklrch.l = 0.5;
color.oklrch.c = 0.2;
color.oklrch.h = 180;
color.toString();

Oklrab

src/spaces/oklrab.js

Base: Oklab
White point:: D65
Coordinates:: Id Name Ref. range

l Lightness 0 – 1

a -0.4 – 0.4

b -0.4 – 0.4

Id	Name	Ref. range
l	Lightness	0 – 1
a	-0.4 – 0.4
b	-0.4 – 0.4

let color = new Color("oklrab", [0.46, 0.19799999999999995, -0.20500000000000002]);
color.oklrab.l = 0.5;
color.oklrab.a = 0;
color.oklrab.b = 0;
color.toString();

Okhsl

src/spaces/okhsl.js

Base: Oklab
White point:: D65
Coordinates:: Id Name Ref. range

h Hue 0 – 360

s Saturation 0 – 1

l Lightness 0 – 1

Id	Name	Ref. range
h	Hue	0 – 360
s	Saturation	0 – 1
l	Lightness	0 – 1

let color = new Color("okhsl", [21, 0.99, 0.05]);
color.okhsl.h = 180;
color.okhsl.s = 0.5;
color.okhsl.l = 0.5;
color.toString();

Okhsv

src/spaces/okhsv.js

Base: Oklab
White point:: D65
Coordinates:: Id Name Ref. range

h Hue 0 – 360

s Saturation 0 – 1

v Value 0 – 1

Id	Name	Ref. range
h	Hue	0 – 360
s	Saturation	0 – 1
v	Value	0 – 1

let color = new Color("okhsv", [352, 0.16, 0.6]);
color.okhsv.h = 180;
color.okhsv.s = 0.5;
color.okhsv.v = 0.5;
color.toString();

P3

src/spaces/p3.js

The color space of most commercial wide gamut screens today. 50% larger gamut (by volume) than sRGB. CSS Color level 4 allowed these colors to be used in stylesheets for the first time. It is derived from a digital cinema projector standard, DCI-P3 but the transfer curve, whitepoint and viewing conditions are the same as for sRGB.

Base: Linear P3
White point:: D65
Coordinates:: Id Name Ref. range

r Red 0 – 1

g Green 0 – 1

b Blue 0 – 1

Id	Name	Ref. range
r	Red	0 – 1
g	Green	0 – 1
b	Blue	0 – 1

let color = new Color("p3", [0.71, 0.35000000000000003, 0.37]);
color.p3.r = 0.5;
color.p3.g = 0.5;
color.p3.b = 0.5;
color.toString();

Learn more about P3

Linear P3

src/spaces/p3-linear.js

Base: XYZ D65
White point:: D65
Coordinates:: Id Name Ref. range

r Red 0 – 1

g Green 0 – 1

b Blue 0 – 1

Id	Name	Ref. range
r	Red	0 – 1
g	Green	0 – 1
b	Blue	0 – 1

let color = new Color("p3-linear", [0.22, 0.64, 0.03]);
color.p3_linear.r = 0.5;
color.p3_linear.g = 0.5;
color.p3_linear.b = 0.5;
color.toString();

ProPhoto

src/spaces/prophoto.js

Very wide gamut RGB color space with primaries outside the range of human vision. Designed to avoid hue shifts when sigmoid (contrast-changing) functions are applied directly to the RGB channels, so it is popular as an authoring space for digital photography. Includes 90% of visible colors, but also encodes many values that are not physically realizable colors. Requires gamut mapping before display.

Base: Linear ProPhoto
White point:: D50
Coordinates:: Id Name Ref. range

r Red 0 – 1

g Green 0 – 1

b Blue 0 – 1

Id	Name	Ref. range
r	Red	0 – 1
g	Green	0 – 1
b	Blue	0 – 1

let color = new Color("prophoto", [0.64, 0.5700000000000001, 0.59]);
color.prophoto.r = 0.5;
color.prophoto.g = 0.5;
color.prophoto.b = 0.5;
color.toString();

Learn more about ProPhoto

Linear ProPhoto

src/spaces/prophoto-linear.js

Base: XYZ D50
White point:: D50
Coordinates:: Id Name Ref. range

r Red 0 – 1

g Green 0 – 1

b Blue 0 – 1

Id	Name	Ref. range
r	Red	0 – 1
g	Green	0 – 1
b	Blue	0 – 1

let color = new Color("prophoto-linear", [0.05, 0.08, 0.63]);
color.prophoto_linear.r = 0.5;
color.prophoto_linear.g = 0.5;
color.prophoto_linear.b = 0.5;
color.toString();

REC.2020

src/spaces/rec2020.js

A very wide gamut RGB color space used in 4k and 8k UHDTV. It is currently difficult to make a screen which displays the entire REC.2020 gamut; current movies broadcast in this colorspace do not use the full gamut, although they do use a little more than P3.

Base: Linear REC.2020
White point:: D65
Coordinates:: Id Name Ref. range

r Red 0 – 1

g Green 0 – 1

b Blue 0 – 1

Id	Name	Ref. range
r	Red	0 – 1
g	Green	0 – 1
b	Blue	0 – 1

let color = new Color("rec2020", [0.84, 0.47000000000000003, 0.6]);
color.rec2020.r = 0.5;
color.rec2020.g = 0.5;
color.rec2020.b = 0.5;
color.toString();

Learn more about REC.2020

Linear REC.2020

src/spaces/rec2020-linear.js

Base: XYZ D65
White point:: D65
Coordinates:: Id Name Ref. range

r Red 0 – 1

g Green 0 – 1

b Blue 0 – 1

Id	Name	Ref. range
r	Red	0 – 1
g	Green	0 – 1
b	Blue	0 – 1

let color = new Color("rec2020-linear", [0.31, 0.51, 0.08]);
color.rec2020_linear.r = 0.5;
color.rec2020_linear.g = 0.5;
color.rec2020_linear.b = 0.5;
color.toString();

REC.2100-HLG

src/spaces/rec2100hlg.js

One of the two HDR forms of Rec.2020; HLG stands for Hybrid Log-Gamma and is designed to maximise compatibility with SDR broadcast standards. REC.2100-HLG encodes relative scene luminance, so that it can be adapted to a wide range of viewing conditions and display peak luminances. Media white is encoded at a value of 0.75, values brighter than that are highlights.

Base: Linear REC.2100
White point:: D65
Coordinates:: Id Name Ref. range

r Red 0 – 1

g Green 0 – 1

b Blue 0 – 1

Id	Name	Ref. range
r	Red	0 – 1
g	Green	0 – 1
b	Blue	0 – 1

let color = new Color("rec2100hlg", [0.47000000000000003, 0.8200000000000001, 0.66]);
color.rec2100hlg.r = 0.5;
color.rec2100hlg.g = 0.5;
color.rec2100hlg.b = 0.5;
color.toString();

Learn more about REC.2100-HLG

Linear REC.2100

src/spaces/rec2100-linear.js

Base: XYZ D65
White point:: D65
Coordinates:: Id Name Ref. range

r Red 0 – 1

g Green 0 – 1

b Blue 0 – 1

Id	Name	Ref. range
r	Red	0 – 1
g	Green	0 – 1
b	Blue	0 – 1

let color = new Color("rec2100-linear", [0.1, 0.21, 0.07]);
color.rec2100_linear.r = 0.5;
color.rec2100_linear.g = 0.5;
color.rec2100_linear.b = 0.5;
color.toString();

REC.2100-PQ

src/spaces/rec2100pq.js

One of the two HDR forms of Rec.2020; PQ stands for Perceptual Quantizer and is designed to avoid banding when HDR material is encoded with only 10 or 12 bits per component. REC.2100-PQ encodes absolute display luminance, in the range 0 to 10,000 cd/m2. Intended to be viewed in a dim viewing environment. Media white is typically displayed at around 200 cd/m2 (varying with content), values brighter than that are highlights.

Base: Linear REC.2100
White point:: D65
Coordinates:: Id Name Ref. range

r Red 0 – 1

g Green 0 – 1

b Blue 0 – 1

Id	Name	Ref. range
r	Red	0 – 1
g	Green	0 – 1
b	Blue	0 – 1

let color = new Color("rec2100pq", [0.22, 0.42, 0.09]);
color.rec2100pq.r = 0.5;
color.rec2100pq.g = 0.5;
color.rec2100pq.b = 0.5;
color.toString();

Learn more about REC.2100-PQ

Absolute XYZ D65

src/spaces/xyz-abs-d65.js

Base: XYZ D65
White point:: D65
Coordinates:: Id Name Ref. range

x Xa 0 – 9,504.7

y Ya 0 – 10,000

z Za 0 – 10,888.3

Id	Name	Ref. range
x	Xa	0 – 9,504.7
y	Ya	0 – 10,000
z	Za	0 – 10,888.3

let color = new Color("xyz-abs-d65", [3040, 1400, 3800]);
color.xyz_abs_d65.x = 4750;
color.xyz_abs_d65.y = 5000;
color.xyz_abs_d65.z = 5440;
color.toString();

XYZ D50

src/spaces/xyz-d50.js

XYZ-D50 assumes the eye is adapted to the graphic arts D50 daylight white point, which is the case for ProPhoto RGB. Measured CIE Lab values are also typically reported with a D50 white point. Color.js will also internally create XYZ color spaces with different white points as needed (for example, converting to and from the ACES color spaces).

Base: XYZ D65
White point:: D50
Coordinates:: Id Name Ref. range

x X –

y Y –

z Z –

Id	Name	Ref. range
x	X	–
y	Y	–
z	Z	–

let color = new Color("xyz-d50", [NaN, NaN, NaN]);
color.xyz_d50.x = NaN;
color.xyz_d50.y = NaN;
color.xyz_d50.z = NaN;
color.toString();

Learn more about XYZ D50

XYZ D65

src/spaces/xyz-d65.js

The fundamental CIE color space, derived from color-matching experiments on human vision. All other color spaces can be converted to XYZ. Encodes linear light intensity. XYZ-D65 assumes the eye is adapted to the D65 daylight white point, which is true for most color spaces.

White point:: D65
Coordinates:: Id Name Ref. range

x X –

y Y –

z Z –

Id	Name	Ref. range
x	X	–
y	Y	–
z	Z	–

let color = new Color("xyz-d65", [NaN, NaN, NaN]);
color.xyz_d65.x = NaN;
color.xyz_d65.y = NaN;
color.xyz_d65.z = NaN;
color.toString();

Learn more about XYZ D65

XYZ D65

src/spaces/XYZ D65.js

Alias of

White point:: D65
Coordinates:: Id Name Ref. range

x X –

y Y –

z Z –

Id	Name	Ref. range
x	X	–
y	Y	–
z	Z	–

let color = new Color("xyz", [NaN, NaN, NaN]);
color.xyz.x = NaN;
color.xyz.y = NaN;
color.xyz.z = NaN;
color.toString();

sRGB

src/spaces/srgb.js

The color space of all CSS colors before CSS Color Level 4, sRGB is derived from the definition of HDTV. Most screens can display all, or very nearly all, sRGB colors but there are many visible colors which lie outside the sRGB gamut.

Base: Linear sRGB
White point:: D65
Coordinates:: Id Name Ref. range

r Red 0 – 1

g Green 0 – 1

b Blue 0 – 1

Id	Name	Ref. range
r	Red	0 – 1
g	Green	0 – 1
b	Blue	0 – 1

let color = new Color("srgb", [0.87, 0.87, 0.62]);
color.srgb.r = 0.5;
color.srgb.g = 0.5;
color.srgb.b = 0.5;
color.toString();

Learn more about sRGB

Linear sRGB

src/spaces/srgb-linear.js

sRGB, but with a linear-light transfer function.

Base: XYZ D65
White point:: D65
Coordinates:: Id Name Ref. range

r Red 0 – 1

g Green 0 – 1

b Blue 0 – 1

Id	Name	Ref. range
r	Red	0 – 1
g	Green	0 – 1
b	Blue	0 – 1

let color = new Color("srgb-linear", [0.14, 0.2, 0.6900000000000001]);
color.srgb_linear.r = 0.5;
color.srgb_linear.g = 0.5;
color.srgb_linear.b = 0.5;
color.toString();

Learn more about Linear sRGB