What is your color system? How are numeric color names better than word ones?

Last update: Sep 28, 2005
Level 3 update on Nov 7, 2007 (Section 4.4 rewritten, hue brightness table slightly adjusted for slightly better accuracy)
Level 0 update on Nov 29, 2007 (apparent brightness formula fixed - misplaced parentheses)
Level 2 update on Sep 29, 2009 (apparent brightness calculator added, thanks to a Web site fan and having found the algorithm myself)

1 Introduction to color basics

1.1 Color basics

As you probably know from art class, there are 3 sets of primary colors. The primary colors of pigments, or cyan, magenta, and yellow, light, made of red, green, and blue, and paint [? don't know], made of red, yellow, and blue. Computer graphics refer to the 3 primary colors of light. Mixing them in different amounts produces varying numbers of colors. Ever wonder what you get when you mix, say, sky blue [color code 6074F2] and dark yellow [color code 808000] in terms of light? It turns out that you end up with a greyish color with a small touch of cyan, or color code 707A79. What does all that mean? Where did I get that resultant color from?

1.2 Why I wrote this

I wrote this document to help explain some of the mathematics behind colors and the wonderful things you can do with them. Art isn't one of my strong points, but mathematics is. Little do some know, there are a lot of mathematics in art which is what helps me out with this. I see colors as a number. I know so few color names as words, but when using numbers to name a color, not only is this list increased, but I can work wonders with it and even do anti-aliasing in MSPaint because of it and to any degree. There are several advantages to using numbers for color names and it can even work with pigments too! I wrote this document to help explain the color names brought up often on my website so you can understand their meanings.

2 The hexadecimal coding

2.1 Understanding hex numbers

Web page designers using HTML color naming should understand this, but if you've never used HTML color naming outside general words like "red", "green", "yellow", "pink", etc., it's unlikely you'll know what these "codes" are. What it is is a hexadecimal numeric code. Hexadecimal is a number base with 16 different digits instead of the normal 10 we know of and actively use. Base-10 is also known as the decimal numeric system, which use the digits: 0, 1, 2, 3, 4, 5, 6, 7, 8, and 9. For hexadecimal, you have 6 extra digits involved including the 10 in the decimal numeric system [or decimal system for short]. The extra digits, which are letters of the alphabet, are: A, B, C, D, E, and F in the same counting order after 9.

2.2 Understanding the color codes

If there are 3 primary colors of light, how do these numbers tell how much of each to use? There are 3 primary colors of light and 6 digits. Break 'em up into groups of 2 and you get the individual values. For the color of the sky, or 6074F2, it can be broken up into 60, 74, then F2. 60 is the hexadecimal number for red [equivelent to 96 in decimal if you're using a graphics program like MSPaint and Paintshop Pro], 74 is the hexadecimal number for green [equal to 116 in decimal], and F2 is the hex number for blue [242 in decimal]. In all hexadecimal color code numbers, the first two digits is the amount of red used, the middle two is the amount of green, and the final two is for blue. Where did I get the 707A79 color from when mixing two colors? This concept is called "averaging" or, if you have consecutive pixels of these two colors next to each other, it is called "dithering".

2.3 All possible colors

If you've always wondered what the colors are of the 24-bit palette, I've created an image that contains all 16,777,216 possible colors. Click here to see the palette. Do note that it takes 48 MB of memory just to display the image so it may not be fully displayed if your system doesn't have much memory. Because there are so many colors, the image is huge. In fact, it's 4096x4096 pixels. No screen resolution today can display that image so scrolling is definitely required. If I were to design the full 32-bit palette (with alpha channel), I'd need an image 16384x16384 pixels and it would use up a whole gigabyte of disk space just to store. The full 24-bit palette takes just 48 MB. The file size of the image is only 59 KB because PNG compresses it extremely well.

To use the chart, each block of 256 pixels has increasing red from left to right and increasing green from top to bottom. Blue increases by 16 steps as you go down a row and by 1 as you go toward the right.

3 Converting between hex and decimal

3.1 A quick conversion chart

3.1.1 Introduction to conversion

First, to understand averaging and what to do to average colors and/or use dithering, you need to know the basics of hexadecimal numbers. Unless you can add and divide hexadecimal [which, surprisingly, is the same as doing it in decimal with small differences], you'll need to know how to convert hexadecimal values to decimal values and back to hexadecimal. Doing so is easier than you think, especially since only two digits are involved (unlike 8 as with memory addresses). These tables below are shortcuts to the hex <�> decimal conversions:

3.1.2 The quick conversion chart

The first digit conversion (base)
Hex	Decimal	Hex	Decimal	Hex	Decimal	Hex	Decimal
0x	0	1x	16	2x	32	3x	48
4x	64	5x	80	6x	96	7x	112
8x	128	9x	144	Ax	160	Bx	176
Cx	192	Dx	208	Ex	224	Fx	240

The second digit conversion (add-on)
Hex	Add	Hex	Add	Hex	Add	Hex	Add
x0	0	x1	1	x2	2	x3	3
x4	4	x5	5	x6	6	x7	7
x8	8	x9	9	xA	10	xB	11
xC	12	xD	13	xE	14	xF	15

3.2 Using the quick conversion tables

3.2.1 From hex to decimal

Given a color, say the color of the sky, which is roughly 6074F2, you need to convert it to decimal.
Break the hex codes into the three sections for each color of light: 60 74 F2.
On the top table (the base), find the "6x" value above. The ones value makes no difference for now. 6x on the table above is 96.
On the bottom table (the add-on), find what the ones digit is equal to and add that to the value found for the tens digit. 96+0=96.
Repeat steps 3 and 4 for green and blue.
To test that color, open up MSPaint, Paintshop Pro, or whatever graphics editor you're comfortable with and enter your decimal values you got. The color should be very close to this text color.

3.2.2 From decimal to hex

Given a random decimal set, say 56 for red, 112 for green, and 224 for blue, converting it back to hexadecimal is almost the same as the above, only backwards.
Always start with the value of red first (although they can be done in any order, this is just recommended).
Find out what the value of red is for 56 on the top table that is closest to the hex value mentioned previously, but without going over. 56 is closest to 48, but 64 would be over. 48 is a 3 for the "tens" digit^*.
Take the decimal value for red and subtract the value you found on the top table. 56�48=8. Find 8 on the bottom table to find out what to use as a hexadecimal digit. 56 converts to 38 in hexadecimal.
Repeat steps 3 and 4 for green and blue.
Checking this color is a bit harder, but on the forums, you can make a test post in the testing area and put some text as "[color:xxxxxx]your test text[/color]" where the six x's stands for your converted hex code. The best way to test it is to create a very simple HTML document of your own and in the body's BGcolor tag, use this color to find out what it is.

4 Averaging and dithering

4.1 Averaging

4.1.1 What averaging is

Averaging is the concept of blending two colors in various ratios to get a new one. At the beginning of the document, you saw that if you mix the color of the sky, or 6074F2, and the code 808000 [dark yellow], you get 707A79 as your end result. This value came from averaging these two colors together in a 1:1 ratio.

4.1.2 How to average colors

4.1.2.1 The process

Averaging is easy. Here's how you do it:

First, convert the hex values to decimal using the steps described between the two above tables.
Sky blue, or 6074F2 converts to 96 red, 116 green, and 242 blue.
Dark yellow, or 808000 converts to 128 red, 128 green, and 0 blue.
Take the two values of red and average them. (96+128)/2=224/2=112. Here, you'd use 112 for red.
Repeat step 4 for green and blue to get 122 for green and 121 for blue.
Convert your decimal values back to hexadecimal to get the 707A79 value I came up with.
Testing this is far harder than the other two ways to test. The best way is by a graphics program.
1. Create a new file in true color [24-bit color] about 300 pixels by more than 50.
2. Split the document in thirds by two black lines spaced 100 pixels apart (or 1/3 of the image width).
3. Edit your colors to get one of the two colors you're wanting to mix. In my example here, bucket fill sky blue on either one of the two sides of your image (left or right, not the center).
4. Edit your colors once more to get the other color, which is dark yellow and bucket fill it on the opposite side.
5. Edit your colors for a final time using the mixed color results and bucket fill this color in the center and bucket fill those black lines you made.
6. This'll create the illusion that the two colors are perfectly blended in together.
7. You can try the magical color changer below a ways to see it for yourself. Note to get the true overlapping effect, the color ratios must be identical. You can still notice it with other ratios, but, in a 1:1 ratio, the objects appear to occupy the same position instead of having depth.

4.1.2.2 The formula

Curious on what the formula is to calculate the resultant color either from alpha channel or otherwise? Ever wonder what formula I used to calculate these resultant colors? This is the formula. It comes in 3 stages, and must be processed for each of the 3 major channels: red, green, and blue (one run for red, a second time for green, and a third for blue, though it can be done in any order):

MCOL=(COLA�RATA+COLB�RATB)�(RATA+RATB)

MCOL - mixed color - the color you get from mixing the two
COLA - first color, usually the background
RATA - ratio of the first color - how many parts of this color to mix
COLB - second color, usually the upper layer
RATB - ratio of the seond color - how many parts of this color to mix

Adding RATA and RATB will give the total number of parts (255 for alpha). Because colors have to be integers only, the value is rounded to the nearest integer.

4.2 Dithering

4.2.1 What dithering is

Dithering is the concept of using two different colors in some way to mix colors. Using the sky blue and dark yellow example in the testing part of the list above, you can also mix these two colors together to get this result.

4.2.2 How to use dithering

Using your graphics editor, this is how you use dithering:

Create a new document of any size greater than at least 32 pixels on both sides. Zoom in to at least 4 times the zoom, but more you zoom in, the easier it is to do.
Edit your colors to get the sky blue color again.
Create a very small square [must be one pixel at a time] inside your document and create a sky blue and white checkerboard pattern. Tip: It's much faster if you just do 4 squares across the top row alternating and a layer below. Stop when you finish two rows of squares.
Edit your colors a final time to get the dark yellow color.
Between your sky blue squares paint your dark yellow squares alternating to create a simple 8x2 sky blue and dark yellow checkerboard. If you accidently cover a sky blue square with yellow, press Control+Z to undo it [or go to edit, then undo].
Using your select tool, select this square grid you made and copy and paste it to make an even bigger checkerboard. Keep copying and pasting until your whole document is filled [Hint: If you're using a large document, you might want to select the bigger groups of squares, copy and paste those a few times, select the even bigger square and repeat.]
Finally, zoom out so that the image is true size.

This makes it seem as if the color wasn't really sky blue and dark yellow, they seemed to have blended together. This is a trick of the human eye and it's even more effective if you're using a small screen, using a high resolution, and/or viewing it from a great distance.

4.3 A simple palette example

If you were to average all the 16 colors you get with the palette for 4-bit color, you'd have 50 total colors if you use the dithering concept. For those who don't know what colors you get with a 4-bit palette, this list consists of all these colors as well as their apparent brightnesses to the human eye (the apparent brightness is very accurate):

color	color sample	hex code value	approx. brightness^*
black		000000	0
grey		808080	128
dark red		800000	69
dark yellow		808000	123
dark green		008000	112
dark cyan		008080	115
dark blue		000080	51
dark magenta		800080	76
white		FFFFFF	255
light grey		C0C0C0	192
red		FF0000	138
yellow		FFFF00	246
green		00FF00	224
cyan		00FFFF	230
blue		0000FF	102
magenta		FF00FF	152

Table footnotes:
* See the next section for details on the approximate brightness.

4.4 Apparent brightness

4.4.1 What apparent brightness is

Apparent brightness is the approximate shade of gray a color represents. The color FF8000, orange, has an apparent brightness of 157. That is, if you put this color and 9D9D9D side by side, you couldn't tell which is brighter. Putting yellow, FFFF00, and white, FFFFFF, next to each other has a small difference and the apparent brightness values of 239 and 255 explains it. I've found that most image editors use an extremely inaccurate method, but, through experimenting around, I found a formula that makes the conversion pretty much right on as far as I can tell.

Confirmation status: yet to be validated

ApparentBrightness ~ (HighValue*LowValue + BaseGrayShade*Value*(HighValue-LowValue))/HighValue;

HighValue - the highest value in the trio. For the color FFC040, a yellowish orange color, it'd be the FF part, 255.
LowValue - the lowest value in the trio. It would be the 40 part, or 64 in the example.
BaseGrayShade - the shade of gray that approximates the apparent brightness of the pure hue. A pure hue is a color with one value being FF, another being 00, and the other being anything. FFC040's pure hue is 40�, or FFAA00.
Value - The "value" aspect in the HSV system, determined by doing "HighValue/255".

The table and graph below (both need to be corrected) show the apparent brightness values of each hue spaced 10� apart. Red is 0�, yellow is 60�, blue is 240�, etc..

Hue	Bright	Hue	Bright	Hue	Bright
0�	120	120�	212	240�	85
10�	125	130�	213	250�	89
20�	134	140�	214	260�	96
30�	157	150�	216	270�	106
40�	179	160�	219	280�	118
50�	210	170�	224	290�	133
60�	239	180�	231	300�	146
70�	232	190�	197	310�	136
80�	220	200�	165	320�	128
90�	215	210�	136	330�	124
100�	213	220�	113	340�	122
110�	212	230�	90	350�	121

The table below is actually a calculator. It will calculate not only the apparent brightness for any color, but also the hue, saturation, and value of that color. Although hue, saturation, and value are all to 4 significant figures for precision, apparent brightness is actually precise to about 1.2 significant figures. 1.2 significant figures seems bizarre, but it merely means that, for 100, the precision is good to within 6.3 (for 95% certainty, my standard minimum), as opposed to 10 (for 1) or 1 (for 2). This is based on "100/(10^1.2)", in case you're wondering. At 255, the precision is good to within 16.1. The lower the saturation and the lower the value, the more precise the result is. Hue, saturation, and value, however, have exact values, an infinite number of significant figures precision, but the result is just rounded to 4 significant figures instead. The algorithm was developed and written by me (though it needs a few touchups), but the credits for converting the C-format algorithm into javascript so it can be used with Web pages goes to Soun. Thank you for this!

	Apparent brightness
Red	Hue
Green	Saturation
Blue	Value

4.4.2 Contrast

Contrast is the difference in apparent brightness between two colors. This involves a very simple formula:

Contrast = abs(FirstColorApparentBrightness-SecondColorApparentBrightness); abs - the absolute value function (or, basically, if you get a negative sign, get rid of it, but do nothing if there isn't one).
FirstColorApparentBrightness - the apparent brightness of the first color being compared.
SecondColorApparentBrightness - the apparent brightness of the second color being compared.

You might have seen a few of my remarks where the contrast should be at least 64 (96 recommended). This is for ease of viewing. Sites that use black text on my dark gray background (due to the background color not being defined and my theme's style) have a contrast of 48 which is too low for easy reading. If you want to check your site's contrasts, just input the color for each and note what the apparent brightness is. Find the difference and if it's at least 64, you're okay, and if at least 96, you're good to go.

4.5 The alpha channel

4.5.1 What is the alpha channel?

Just like red, green, and blue, alpha is another one of those channels, only with a special feature. Alpha is often used as transparency (though it can be used for other things, transparency is the most common). The red channel deals with red. The green channel deals with green. The blue channel deals with blue. Alpha deals with transparency (and rarely something else).

4.5.2 How the alpha channel works

When you have a solid-colored background in an image, how does the alpha channel work? If you had something mostly transparent in a layer above, it would look different. How is that new color determined? Simple: averaging. Unlike with more standard ratios like 3:2 or 13:19, alpha is based on ratios of x to 255. If a particular color had an alpha of 176, for example. You'd have 176 parts of that transparent color to 79 parts of the background color (255-176 - of what remains). That is, if the background was white (FFFFFF) and you added orange (FF8000) with an alpha of 176 in a layer above, the color you should see would be FFA74F. If you had another layer on top of that, the lower layers are calculated first then the higher layers. It's an interesting concept and I knew about this before I actually even began working with the alpha channel! When you put something transparent over another thing transparent without a solid background, that's where I'm at a loss as I don't know how that works quite yet.

5 Putting averaging and dithering to use

5.1 A great example

If you were to cross these 16 colors in every which way you can, you'd get a total of 50 unique colors. If you were to express all these colors on a color chart, this is what you'll see:

How to use this color chart:

The palette is arranged in the same pattern. The colors being averaged [or dithered with] are between the two. The color closest to the coresponding palette is the color being averaged or dithered. The palettes to the right of the focused color is always in the same order. The colors in order from the top to the bottom of the left side in the central area is the top row in each segment. The right colors from top to bottom make the bottom row of the segment.
Let's cross true blue with gray as an example.
Find either the gray or true blue color in the central area [it doesn't make a difference which one you choose, both lead to the same color]. Let's say that we choose gray first. Find the gray square in the central area and note the palette (of the same colors in the same order).
Find the color you wish to merge it with (blue in our example) in the palette to the side of the main. Where the blue square is is on the side palette is where the merged color is.
Doing the averaging, you should get the color 4040C0, a blue-gray color. Using the eyedropper tool in your graphics editor using the true color image would reveal this exact color.

The top image is the results of crossing the two colors in true color. The bottom image is an illusion as there's only 16 colors involved, not 50. If you were to zoom into this image by a magnification of 4 times the normal size, this is what you'll see:

This effect is called dithering. The first image doesn't have dithering, but the mixing is the same. This is called averaging [or color-crossing].

5.2 Transparency on graphics

Simulating transparency is seemingly impossible as far as drawing images, yet, it's easier than you think. Consider these two images. The first one is the root image. The second one is with 3/4 transparency 404040 colored box with 1/2 transparent FFA000 text in it. Real transparency in 2D drawings cannot be easily used with general programs like Paint and Photostudio. Instead, you need to average the colors out to give the sense of transparency. Newer pieces of software allow for the use of the alpha channel which is transparency. This averaging method is exact compared to using alpha.

This image is of a small greenish beach with a cloudless sky. Here, you can see how little of a change there is in the background, but the transparent object still shows well. This is an animated image. Every 2 seconds, it'll change. The second one has a "spell failed" notice^***.

5.3 Averaging and dithering in videos

One other use of averaging is involved with making animations and something lasting for a fraction of a frame. With averaging, you can make a simulation that an animated image or a video is seemingly played at a faster frame rate that what it really is. For example, if your animation was played at 10 frames per second and you want an effect of a sudden, white flash lasting for a 20th of a second, you'd average all the colors in the previous frame with one part white, save that frame, then revert back to normal.

5.4 A sense of great resolution

Averaging is far more useful when you want finer-looking videos or animations. If you use averaging with 4 parts total [a mix of 0 parts color 1 and 4 parts of color 2, 1 part color 1 and 3 color 2, etc.], you can give the sense that your image has four times the resolution, though this is limited to a certain point. Using this in an actual animation can give you this:

image of colored bars moving across the screen 4 times finer than your current resolution

Watch the green bars closely and carefully. This animation updates 10 times a second. It won't take long to notice a significant amount of movement. Try placing your mouse arrow over one of the bars and keep it still for about 5 seconds. You'll notice that those bars have moved about 12 pixels [or so it seems about 50] to the left. Though, the only minus side on using this [for this type of pattern] is, if you look closely enough, that it appears as if the image suddenly gets brighter, even though you're constantly seeing the same color center. If you were to magnify this image by 4 times it's width, you'll see the real secret that there is no extra fineness to the image, though it seems like it at true size:

image of colored bars moving across the screen 4 times finer than your current resolution

image of colored bars moving across the screen 4 times finer than your current resolution

At four times the width, seeing the secret is not much of a problem, though the effect of the appearant brightness changing still occurs, but it's somewhat less noticable.

5.5 Half-transparent GIFs

Think about GIF images. They only allow for two degrees of transparency: fully visible and fully transparent. With dithering, you can make half-transparent GIFs (or parts of it like that anyway). It might not seem possible, but if you were to use a checkerboard pattern alternating between fully visible and fully transparent, you can simulate this. Take this two-frame animated GIF as an example.

It just seems like that object just darkens. The only difference between the two are the fact that there is a checkerboard pattern for the background. If you were to magnify this image to 4 times the size, you'll see this which looks remarkably different, even though it's the exact same file.

If you had a background that changes, watch the color of this same image (again, the same exact file, only not stretched):

This is an illusion. The background changes constantly, but the image, being completely static, seems to change as well because of this.

5.6 An interactive example on averaging

If you'd like to see how this averaging works, try it yourself with this instant-change image:

Note: To get the image to appear as if the two colors were overlapping, the two ratio values must be equal, but the colors can be of anything.

Script credits: Slider142 from the howwhatwhy forums.

6 Going beyond 6 digits

6.1 The basics of 12-digit colors

Though not quite fully developed, a 12-digit color will just explain more about the object. Here's a description on each. We'll use the color 0123456789AB as a guide.

6.2 Red, green, and blue

These three channels are the ones we're most familiar with. Mix these three in in various amounts and you get a color. I shouldn't need to explain these three, however.

6.3 Alpha channel - transparency

The alpha channel, in my color system, is used for transparency (in computers, it can be used for other things as well, mostly transparency though). Something with an alpha of FF is fully visible. Something with an alpha of 00 means that it cannot be seen. Glass is around 10 to 20, depending on the thickness.

6.4 Beta channel - reflectivity

This is unfamiliar territory for most everyone. I name it "beta channel" as, as with alpha being the first letter of the Greek alphabet, beta happens to be the second. The concept is rather straightforward, however. A mirror has a reflectivity of FF, fully reflective. When something is fully reflective, you cannot determine the "background color". Something with a reflectivity of 00 (very rare) means that it doesn't reflect any of the surroundings onto it. If it was 40, it'd be like a mirror, only with the colors of the surroundings averaged to 1/4 (as if the things in the "mirror" were mixed in a 1:3 ratio with 1 part used for the reflected part and 3 parts the original color. Most objects hover around 04 and 20 for the beta channel.

6.5 Gamma channel - emissive

The gamma channel is the emissive power of the object. I name it "gamma channel" as gamma is the third letter of the Greek alphabet. Most objects are 00. Only hot objects are otherwise. 00 means that it doesn't emit anything at all. FF means that the color you see is only from it emitting the color (and not mixed in). FF is extremely rare, except with stars. If something was 20 for the gamma channel, you'll see one part of the emissive color (gamma red, gamma green, and gamma blue (having three more doublets)) mixed in with 7 parts of the base color.

6.6 An example of using the extended version

We all know water. Often, others think of it as being blue when actually it's more of a grayish color. The blue comes from reflecting the sky (and sometimes other factors like a blue bottom such as in a pool, or organisms in the water that are blue). Water, to the best of my knowledge is the color E0E0E0103000 when viewed up close. When viewing it at a very horizontal angle, it's actually more around E0E0E0FFF000 or something.

As you probably know, the color E0E0E0 is a very light gray. 10 is the alpha channel meaning that it is 1/16 transparent (more technically, it means that it is 16/255 transparent). You can see through it quite well but it is visible. 30 is the beta channel, the reflectivity. This means that the image reflected is roughly 1/5 that of the actual and thus the color is mixed in. It's this that makes water look blue due to the sky. 00 is the gamma channel. Water doesn't emit any visible light (as far as I know) and thus would leave the gamma red, gamma green, and gamma blue indexes all with 00.

7 The pros and cons of using numeric color names

As interesting as this seems, there are a lot of advantages and a few disadvantages with naming colors as numbers instead. The list of pros is long and strong and the list of cons is short and moderate. We'll cover the pros and cons between using numeric color names and the old fashioned color names.

7.1 The advantages

7.1.1 Averaging is very useful

There are so many uses for using numeric color names versus word color names. Consider the averaging effect. You can't figure out what your result would be if you mixed brown and yellow-orange just knowing the color names and with great precision. Brown happens to be 804020 and yellow orange is FFC000. Do the averaging yourself to see what the result is and create an image similar to what the overlapping illusion effect is with brown on the left [or right, whichever you choose], and yellow-orange on the opposite side leaving the center where the overlapping is. Doing this is described in the beginning of the "averaging and dithering" section. Just only knowing the word names, you can't tell but only guess. Also, with averaging, you can make a simulation that an animated image or a video is seemingly played at a faster frame rate that what it really is. For example, if your animation was played at 10 frames per second and you want an effect of a sudden, white flash lasting for a 20th of a second, you'd average all the colors in the previous frame with one part white, save that frame, then revert back to normal for your next frame.

7.1.2 Word color names are confusing to remember

Another advantage over numeric color names is that they can be hard to forget once you have a fair amount of experience recognizing colors and their color values. Let's say I told you that there was a color called "dawn green". If you were to look at it, you might think it resembles yellow-green but dawn green has a bit more gray to it [less saturation]. The color code for this imaginary color is 70B050. After you know the color system for a very long time [like I have], later on, you're quite likely to forget the color name "dawn green". But if you look at it carefully enough, you might be able to pick out the 70B050 color with sufficient accuracy. An advanced user like myself can get as accurate to within 32 decimal units from the real value (when the colors don't have much change, it can be up to even 64 (as with yellow to green and to cyan) but as little as 16 for where the contrast is very high.). Better put, the color I come up with is usually �8 in terms of the contrast variation which is pretty good.

7.1.3 Finding opposites is easy

Another use is finding opposites of colors with ease. You do know that black and white are opposites, but did you know that red and cyan, yellow and blue, as well as green and magenta are opposites too? The color opposite that of the color of the sky is 9F8B07, a yellowish color. The color opposite of yellow-orange [FFC000] is 003FFF, a bluish-cyan type color. Given a random color, say 44896B [a weird blue-green-gray color], you can easily find the opposite by taking 255 and subtracting the converted versions of these color codes. Note that in the 4-bit palette image above, when you mixed true red with true cyan, you end up with 808080, a color already on the palette. When you mix the darker versions of the colors, they cancel out and make a dark gray, which is obviously 404040. The color, 404040 is not an opposite as it's opposite is BFBFBF. If it didn't have an opposite, it would be 808080, or true gray. In a sense, this color has an opposite: 7F7F7F, a difference too close to tell the difference between. That image you see on the top literally has 390,152 *different* colors!

7.2 The disadvantages

The disadvantages aren't as strong as the advantages are so the pros heavily outweigh the disadvantages.

7.2.1 It only works for light

A minor disadvantage is that it does not apply to general art using paints, colored pencils, etc. I believe, however, that it *IS* very possible to create a numeric system for pigments as well with cyan, magenta and yellow being used instead of red, green and blue. Currently, this is very hard to test.

As far as I know, it would be based on the CMY system (not CMYK). Red, green, and blue's opposites in the same order. Mix cyan and magenta and you'd get blue. Mix magenta and yellow and you'd get red. Mix cyan and yellow and you get green. The color FF8000, as I see it, would be orange in terms of light but a color halfway between cyan and blue (or 007FFF in terms of light). I seems that pigments are exactly like light, except that the colors are inverted (opposites), one of the advantages of numeric color names. This, however, is untested and thus unconfirmed. The guide is my printer.

7.2.2 Naming colors away from computers

Naming colors outside computer data [like that of the color of your computer's monitor or wall paint color] is very difficult to do, but if you're very experienced with numeric color names and know hexadecimal very well, it can be easily done. The way I name colors outside the computer is by simply doing the following:

I look at the color and determine it's base, whether it's red, yellow, green, cyan, blue, or magenta.
I then create "fades" in my mind if the color is between one of the six base colors. I then get the base hue from there.
I examine how gray it seems. The more gray, the closer the numeric values are. A pure hue is where one of the three channels is FF and a second is 00 with the other remaining one being anything. A color like FF8080 is not technically a light red. It's actually a brighter version of C06060, a reddish gray color.
I then examine the relative brightness. If it's a darker version of that color, I'll know that. If it's a lighter version, however, it's more gray.
I picture easily remembered colors in my mind with known color codes and compare it to the color in question.
I then adjust to compensate for the differences.

Given the "dawn green" color as a guide, I first identify the way it is. I notice that it's green right away and more toward the red end, but not much, if any. I also notice that it's quite gray as well. However, it's hard to tell just how much red or blue it has. Given the brightness, I'd have to say that the color would be around 50B050 or so. It's hard to tell if there is any extra red in there, even though there is. The contrast gap from green to yellow is rather small, a mere 22 units. The difference in contrast here is about 4 or so. It's so slight, it's hard to really detect.

Footnotes:
* In hexadecimal, there is no such thing as a "tens" digit. Rather, it's called the "sixteens" digit. I expressed it this way as hex and decimal are very closely related to each other, only with one difference: the number of available digits (16 versus 10).
** The concept of naming colors completely away from computers is quite difficult and I only just started this.
*** Spell failed notices appear when some various effect happens. To learn the complete list of spell failures, what they mean and how to prevent some, read this list of errors.


Color A: Ratio A:	Averaged Color:	Color B: Ratio B: