CSS Color

Note: for demonstration purposes. Content and articulation comes later ~ 5th September 2001.

color cube full
color cube outset
1. rgba(255,255,255,0.0) ~ fuchsia composite on a white background
1. rgba(255,0,255,0.0) ~ fuchsia composite on a white background
color cube inset
1. rgba(0,0,0,0.0) ~ fuchsia composite on a black background
1. rgba(0,0,0,0.0) ~ fuchsia composite on a black background

HSL planes in sRGB color space

Aqua to Red sRGB color plane
rgb(0,255,255)
hsl(127,255,128)		rgb(63,255,255)
hsl(127,255,159)		rgb(127,255,255)
hsl(127,255,191)		rgb(191,255,255)
hsl(127,255,223)		rgb(255,255,255)
hsl(255,0,255)
rgb(0,191,191)
hsl(127,255,96)		rgb(63,191,191)
hsl(127,129,127)		rgb(127,191,191)
hsl(127,85,159)		rgb(191,191,191)
hsl(255,0,191)		rgb(255,191,191)
hsl(255,255,223)
rgb(0,127,127)
hsl(127,255,64)		rgb(63,127,127)
hsl(127,86,95)		rgb(127,127,127)
hsl(255,0,127)		rgb(191,127,127)
hsl(255,85,159)		rgb(255,127,127)
hsl(255,255,191)
rgb(0,63,63)
hsl(127,255,32)		rgb(63,63,63)
hsl(255,0,63)		rgb(127,63,63)
hsl(255,86,95)		rgb(191,63,63)
hsl(255,129,127)		rgb(255,63,63)
hsl(255,255,159)
rgb(0,0,0)
hsl(255,0,0)		rgb(63,0,0)
hsl(255,255,32)		rgb(127,0,0)
hsl(255,255,64)		rgb(191,0,0)
hsl(255,255,96)		rgb(255,0,0)
hsl(255,255,128)
Yellow to Blue sRGB color plane
rgb(255,255,0)
hsl(43,255,128)		rgb(255,255,63)
hsl(43,255,159)		rgb(255,255,127)
hsl(43,255,191)		rgb(255,255,191)
hsl(43,255,223)		rgb(255,255,255)
hsl(255,0,255)
rgb(191,191,0)
hsl(43,255,96)		rgb(191,191,63)
hsl(43,129,127)		rgb(191,191,127)
hsl(43,85,159)		rgb(191,191,191)
hsl(255,0,191)		rgb(191,191,255)
hsl(169,255,223)
rgb(127,127,0)
hsl(43,255,64)		rgb(127,127,63)
hsl(43,86,95)		rgb(127,127,127)
hsl(255,0,127)		rgb(127,127,191)
hsl(169,85,159)		rgb(127,127,255)
hsl(169,255,191)
rgb(63,63,0)
hsl(43,255,32)		rgb(63,63,63)
hsl(255,0,63)		rgb(63,63,127)
hsl(169,86,95)		rgb(63,63,191)
hsl(169,129,127)		rgb(63,63,255)
hsl(169,255,159)
rgb(0,0,0)
hsl(255,0,0)		rgb(0,0,63)
hsl(169,255,32)		rgb(0,0,127)
hsl(169,255,64)		rgb(0,0,191)
hsl(169,255,96)		rgb(0,0,255)
hsl(169,255,128)
Fuchsia to Lime sRGB color plane
rgb(255,0,255)
hsl(212,255,128)		rgb(255,63,255)
hsl(212,255,159)		rgb(255,127,255)
hsl(212,255,191)		rgb(255,191,255)
hsl(212,255,223)		rgb(255,255,255)
hsl(255,0,255)
rgb(191,0,191)
hsl(212,255,96)		rgb(191,63,191)
hsl(212,129,127)		rgb(191,127,191)
hsl(212,85,159)		rgb(191,191,191)
hsl(255,0,191)		rgb(191,255,191)
hsl(85,255,223)
rgb(127,0,127)
hsl(212,255,64)		rgb(127,63,127)
hsl(212,86,95)		rgb(127,127,127)
hsl(255,0,127)		rgb(127,191,127)
hsl(85,85,159)		rgb(127,255,127)
hsl(85,255,191)
rgb(63,0,63)
hsl(212,255,32)		rgb(63,63,63)
hsl(255,0,63)		rgb(63,127,63)
hsl(85,86,95)		rgb(63,191,63)
hsl(85,129,127)		rgb(63,255,63)
hsl(85,255,159)
rgb(0,0,0)
hsl(255,0,0)		rgb(0,63,0)
hsl(85,255,32)		rgb(0,127,0)
hsl(85,255,64)		rgb(0,191,0)
hsl(85,255,96)		rgb(0,255,0)
hsl(85,255,128)
Aqua to Red sRGB color plane 3
rgb(0,255,127)
hsl(127,255,128)		rgb(127,255,255)
hsl(127,255,191)		rgb(255,255,255)
hsl(255,0,255)
rgb(63,191,127)
hsl(127,129,127)		rgb(191,191,191)
hsl(255,0,191)
rgb(0,127,63)
hsl(127,255,64)		rgb(127,127,127)
hsl(255,0,127)		rgb(255,127,191)
hsl(255,255,191)
rgb(63,63,63)
hsl(255,0,63)		rgb(191,63,127)
hsl(255,129,127)
rgb(0,0,0)
hsl(255,0,0)		rgb(127,0,63)
hsl(255,255,64)		rgb(255,0,127)
hsl(255,255,128)
Yellow to Blue sRGB color plane 2
rgb(127,255,0)
hsl(43,255,128)		rgb(191,255,127)
hsl(43,255,191)		rgb(255,255,255)
hsl(255,0,255)
rgb(127,191,63)
hsl(43,129,127)		rgb(191,191,191)
hsl(255,0,191)
rgb(63,127,0)
hsl(43,255,64)		rgb(127,127,127)
hsl(255,0,127)		rgb(191,127,255)
hsl(169,255,191)
rgb(63,63,63)
hsl(255,0,63)		rgb(127,63,191)
hsl(169,129,127)
rgb(0,0,0)
hsl(255,0,0)		rgb(63,0,127)
hsl(169,255,64)		rgb(127,0,255)
hsl(169,255,128)
Aqua to Red sRGB color plane
rgb(255,127,0)
hsl(21,255,128)		rgb(255,191,127)
hsl(21,255,191)		rgb(255,255,255)
hsl(255,0,255)
rgb(191,127,63)
hsl(21,129,127)		rgb(191,191,191)
hsl(255,0,191)
rgb(127,63,0)
hsl(21,247,65)		rgb(127,127,127)
hsl(255,0,127)		rgb(127,191,255)
hsl(148,255,191)
rgb(63,63,63)
hsl(255,0,63)		rgb(63,127,191)
hsl(148,129,127)
rgb(0,0,0)
hsl(255,0,0)		rgb(0,63,127)
hsl(85,255,64)		rgb(0,127,255)
hsl(85,255,128)

Gradients

  1. white to transparent-black composite of a white background
  2. white to transparent-black composite on a black background
  3. black to transparent-white composite of a white background
  4. black to transparent-white composite of a black background
1. white to transparent-black composite of a white background
pathnon-premultipliedcomposite on white
0%0rgba(255,255,255,1.0)rgb(255,255,255)
6.25%16rgba(239,239,239,0.9375)rgb(240,240,240)
12.5%32rgba(223,223,223,0.875)rgb(227,227,227)
25%64rgba(191,191,191,0.75)rgb(207,207,207)
50%127rgba(127,127,127,0.5)rgb(191,191,191)
75%191rgba(64,64,64,0.25)rgb(207,207,207)
87.5%223rgba(32,32,32,0.125)rgb(227,227,227)
93.75%239rgba(16,16,16,0.0625)rgb(240,240,240)
100%255rgba(0,0,0,0.0)rgb(255,255,255)
2. white to transparent-black composite on a black background
pathnon-premultipliedcomposite on black
0%0rgba(255,255,255,1.0)rgb(255,255,255)
6.25%16rgba(239,239,239,0.9375)rgb(224,224,224)
12.5%32rgba(223,223,223,0.875)rgb(195,195,195)
25%64rgba(191,191,191,0.75)rgb(143,143,143)
50%127rgba(127,127,127,0.5)rgb(64,64,64)
75%191rgba(64,64,64,0.25)rgb(16,16,16)
87.5%223rgba(32,32,32,0.125)rgb(4,4,4)
93.75%239rgba(16,16,16,0.0625)rgb(1,1,1)
100%255rgba(0,0,0,0.0)rgb(0,0,0)
3. black to transparent-white composite of a white background
pathnon-premultipliedcomposite on white
0%0rgba(0,0,0,1.0)rgb(0,0,0)
6.25%16rgba(29,29,29,0.9375)rgb(31,31,31)
12.5%32rgba(52,52,52,0.875)rgb(60,60,60)
25%64rgba(84,84,84,0.75)rgb(112,112,112)
50%127rgba(127,127,127,0.5)rgb(191,191,191)
75%191rgba(191,191,191,0.25)rgb(239,239,239)
87.5%223rgba(223,223,223,0.125)rgb(251,251,251)
93.75%239rgba(239,239,239,0.0625)rgb(254,254,254)
100%255rgba(255,255,255,0.0)rgb(255,255,255)
4. black to transparent-white composite of a black background
pathnon-premultipliedcomposite on black
0%0rgba(0,0,0,1.0)rgb(0,0,0)
6.25%16rgba(16,16,16,0.9375)rgb(15,15,15)
12.5%32rgba(32,32,32,0.875)rgb(28,28,28)
25%64rgba(64,64,64,0.75)rgb(48,48,48)
50%127rgba(127,127,127,0.5)rgb(64,64,64)
75%191rgba(191,191,191,0.25)rgb(48,48,48)
87.5%223rgba(223,223,223,0.125)rgb(28,28,28)
93.75%239rgba(239,239,239,0.0625)rgb(15,15,15)
100%255rgba(255,255,255,0.0)rgb(0,0,0)