Colors on the Web
http:// www.agu.ac.jp / ~vicks62 / jeffreyb / color. html |
---|
The Big Bang:
100 billionth of a yocto second--pure energy turned to a mixture of matter and anti-matter
1 pico second--matter destroyed anti-matter, but some hot liquid matter is left over
first 380,000 years--H and He nuclei covered in a dense fog of electrons
Let there be light.
500, 000 years--The Universe cools down below 4,900 degrees F, clearing the fog of electrons and light escapes in (what I wil call) the Big Flash, then it turns dark again.
200 million years--Average temperature drops below -367 degrees F. Clouds of H and He gas collapse into
stars. As they burn they create chemical elements up the periodoc table to Fe (iron). Super novas (like Super nova 1987a) create elements further up the periodic table (like Zinc). These stars radiate light.
f00 red 750-620 nm |
f73 orange 620-590 |
ff0 yellow 590-570 |
0f0 green 570-520 |
0ff cyan 520-495 |
00f blue 495-450 |
e8e violet 450-380 |
Light radiates as an electromagnetic wave-particle (photon). Different colors are associated with different wave lengths (see above, in nanometers). Long wave lengths produce red light, medium lengths green, and short ones blue/violet, a one-dimensional spectrum of colors.
The eye, however, has three cones which are sensitive to light of different lengths. The L-cone is sensitive to wave lengths of about 650 nm (red), M-cones to lengths of about 530 nm (green), and S-cones to those of about 460 nm (blue/violet). This creates a three-dimensional continuum of color.
Imagine a painter and his palette. He uses it to mix colors. Then try to imagine a digital palette of colors that you might use to make all the colors that are displayed on your computer screen. What colors would you use? How bright would they be? How could you combine them?
000 black 0 | 00f blue 7.22 | f00 red 21.26 |
f0f magenta 28.48 | 0f0 green 71.52 | 0ff cyan 78.74 |
ff0 yellow 92.78 | fff white 100 |
Which secondary colors can be combined with the primary colors:
blue?
red?
green?
How many colors would you be able to create? 4, 096? 16, 777, 216?
Where would those colors be located in the continuum?
black 000 |
white fff |
||||||||||||||||
+white | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | a | b | c | d | e | f | -white |
White light is made up of the three primary colors--Red, Green (Lime), and Blue--mixed in equal proportion at full intensity. As you decrease intensity, you go through all the shades of gray until you reach black.
red f00 | yellow ff0 | green 0f0 |
||||||||||||
green 0f0 | cyan 0ff | blue 00f |
||||||||||||
blue 00f | magenta f0f | red f00 |
When you mix two primary colors in different proportions, you can generate a continuum from one to the other, a portion of the color wheel. It goes through the secondary color formed by those two primary colors.
* | * | |||||||
* | * | |||||||
* | * | * | * | * | * | |||
* | * | |||||||
* | * | |||||||
* | * | |||||||
* | * | |||||||
* | ||||||||
* | * | * | * | * | * | * | * | * |
This zig-zag wheel of color goes from corner to corner of the color cube and circles an axis of the shades of gray that goes through Black (bottom, front, left) and White (top, back, right). These hues are the brightest colors.
If you tip the cube so that White is at the top and Black the bottom ... you can imagine a square world of color. The three lower (and darker) faces form a hemisphere (or a hemi-hedron perhaps) of the shades of the colors. The three upper (lighter) faces form a hemihedron of the tints of the colors. The zig-zag wheel forms a wobbly equator dividing these dark and light hemi-hedrons.
The solid cube of color can be thought of as being made up of hollow cubes decreasing in size. Each of these cubes represents the colors at a fixed depth from the surface of the solid cube, which are the brightest (100% saturation).
The corners of the hollow cubes are aligned in straight lines, that converge on the gray center (#808080) of the solid cube
red | yellow | lime | cyan | blue | magenta |
ff-0000 | ffff-00 | 00-ff-00 | 00-ffff | 0000-ff | ff-00-ff |
1 Hex below the surface | |||||
---|---|---|---|---|---|
ee-1111 | eeee-11 | 11-ee-11 | 11-eeee | 1111-ee | ee-11-ee |
2 Hex below the surface | |||||
r [11] | y [11] | g [11] | c [11] | b [11] | m [11] |
dd-2222 | dddd-22 | 22-dd-22 | 22-dddd | 2222-dd | dd-22-dd |
3 Hex below the surface | |||||
cc-3333 | cccc-33 | 33-cc-33 | 33-cccc | 3333-cc | cc-33-cc |
How bright would you rate these colors, from 0 (black) to 100% (white)?
4 Hex below the surface | |||||
---|---|---|---|---|---|
r [7] | y [7] | g [7] | c [7] | b [7] | m [7] |
bb-4444 | bbbb-44 | 44-bb-44 | 44-bbbb | 4444-bb | bb-44-bb |
5 Hex below the surface | |||||
aa-5555 | aaaa-55 | 55-aa-55 | 55-aaaa | 5555-aa | aa-55-aa |
6 Hex below the surface | |||||
r [3] | y [3] | g [3] | c [3] | b [3] | m [3] |
99-6666 | 9999-66 | 66-99-66 | 66-9999 | 6666-99 | 99-66-99 |
7 Hex below the surface | |||||
88-7777 | 8888-77 | 77-88-77 | 77-8888 | 7777-88 | 88-77-88 |
Imagine the colors placed at the corners of a cube. The path from Black (bottom, front, left) to each of the primary colors goes through the shades of those three colors. The path from White (top, back, right) to each of the secondary colors goes through the tints of those three colors.
* | * | * | * | * | * | * | * | * |
* | * | |||||||
* | * | * | ||||||
* | * | |||||||
* | * | |||||||
* | * | |||||||
* | * | * | * | * | * | |||
* | * | |||||||
* | * |
The secondary colors--Yellow, Cyan (light blue), and Magenta (light purple)--are a combination of two primary colors in equal proportion.
red ff-0000 | ff-3333 | ff-6666 | ff-9999 | ff-cccc | white ffffff |
black 000000 | 3333-00 | 6666-00 | 9999-00 | cccc-00 | yellow ffff-00 |
black 000000 | 3333-00 | 6666-00 | 9999-00 | cccc-00 | yellow ffff-00 |
lime 00-ff-00 | 33-ff-33 | 66-ff-66 | 99-ff-99 | cc-ff-cc | white ffffff |
Shades are what you get when you slide ff towards 0 (black).
lime 00-ff-00 |
33-ff-33 | 66-ff-66 | 99-ff-99 | cc-ff-cc | white ffffff |
black 000000 | 00-3333 | 00-6666 | 00-9999 | 00-cccc | cyan 00-ffff |
black 000000 | 00-3333 | 00-6666 | 00-9999 | 00-cccc | cyan 00-ffff |
blue 0000-ff | 3333-ff | 6666-ff | 9999-ff | cccc-ff | white ffffff |
blue 0000-ff | 3333-ff | 6666-ff | 9999-ff | cccc-ff | white ffffff |
black 00-00-00 | 33-00-33 | 66-00-66 | 99-00-99 | cc-00-cc | magenta ff-00-ff |
black 00-00-00 | 33-00-33 | 66-00-66 | 99-00-99 | cc-00-cc | magenta ff-00-ff |
red ff-0000 | ff-3333 | ff-6666 | ff-9999 | ff-cccc | white ffffff |
We can characterize any color as a combination of four: white (tinting), one of the secondary colors (made up of two primary colors), a primary color (one of those two colors), and black (shading).
R G B | 1-2-3 | 2 - 3 | only 3 | none | color | code | |
3 1 2 | green | c0-40-80 | |||||
3 2 1 | blue | c0-80-40 | |||||
2 3 1 | blue | 80-c0-40 | |||||
1 3 2 | red | 40-c0-80 | |||||
1 2 3 | red | 40-80-c0 | |||||
2 1 3 | green | 80-40-c0 |