The Color Palette

First of all: if you have not read the "13h video mode" DOCS of mine yet, then do so before you read this because if you haven't read that yet then this will be as good as an useless piece of crap to you. Actually, if you already have learned how to change to 13h from some other documentation then you really don't need to read my 13h DOC.

What is the color palette?
The color palette is a hardware array (in other words, it's built into your computers hardware) of pointers that point twords a set of RGB(Red Green Blue) values. Each pointer in the array points to (as I stated above) an RGB value. An RGB value is set up like this:

R,G,B

So there are actually 3 values in an RGB value:

R=amount of red in the color=a value that can range from 0-63 (0 being lowest and 63 being highest)
G=amount of green in the color=a value that can range from 0-63 (0 being lowest and 63 being highest)
B=amount of blue in the color=a value that can range from 0-63 (0 being lowest and 63 being highest)

Therefor a full red would look like this: 63,0,0. And a full green would look like this: 0,63,0. And a full blue would look like this: 0,0,63. Get the idea? Good.
So it's just like in art class when you mixed red, yellow and blue paint together to make different colors... except for two things:

1) Instead of yellow you have green.
2) Your not working with matter, your working with light.

Now I'm guessing that you know what the 1st differance means, but you might not know what the second means. Well, that's what I'm here for!
Basically it means that when you mix all of them together at there highest strength (63,63,63) you get white (instead of black like with the paint in art class) and instead of seeing the white paper when there was no paint on it (0,0,0) you get black. Another way to look at it is by imagining the following:

A white piece of paper in a pitch black room.
1) Now when you shine a red light on it (63,0,0), it makes the paper red..
2) When you shine a green light on it (0,63,0), it makes it green..
3) When you shine a blue light on it (0,0,63), it makes is blue..
4) When you shine all of the lights on it (63,63,63), it lets you see the real papers color which is white..
5) When you don't shine any light on it (0,0,0), the room is pitch dark.

That's how I imagine the colors when I'm trying to find the color I want. Can you Guess how to make a full yellow with the RGB values?
The way to make a full yellow is by putting Red at full, Green at full, and no blue (63,63,0). I know that sounds wierd, but it's true.
Well, now you know how to make the colors, so Now you can go on to plotting pixels... NOT!!! Just kidding, do you really think that I would just leave you hanging there, with out even telling you HOW to change the palette? NO! I would never do that! So keep reading.

What does the palette have to do with anything?
Well, first of all, if you can't change the color palette then your stuck with 256 blacks as your array of colors. So if you plot a black pixel on a black back ground nothing changes. There for you must be able to change the color palette so as to be able to change the colors on the screen. Second of all, even if the color palette isn't all black, most likely it will not have the colors you want in the same place that you want them. So you'll be stuck with a color palette that you don't know what colors are where on it. Lastly, if you are programming a 2d computer game you will most likely want to be able to use color rotation (which is discribed later in this document).
So how do I change the palette's colors?
Well, there are several different ways to do it, my favorite (and the only one that I actually know the code for) is the following:

void set_palette(int index, int red, int green, int blue)
{
   outp(RGB_RESET, 0xFF); //Prepare the VGA card for the color change
   outp(RGB_WRITE, index); //Tell which palette register to write to
      //The following values can be anywhere from 0 to 63
   outp(RGB_DATA, red); //change the red value
   outp(RGB_DATA, green); //change the green value
   outp(RGB_DATA, blue); //change the blue value
}

And the code obove should work with DJGPP as long as you use the includes from the 13h DOC of mine and you define the following:

#define RGB_RESET 0x03C6
#define RGB_READ 0x03C7
#define RGB_WRITE 0x03C8
#define RGB_DATA 0x03C9

Of course I also have to tell you how to use this function... basicaly you tell it which color you want to change (index) and then you give it the RGB values (red, green, blue) which can each range from 0-63. So if you wanted to change the color 58 to a RGB value of 20,20,20 (which would be a light gray) you would call the function like this:

set_palette(58, 20, 20, 20);

Now some of you might be wondering how many colors there are in the color palette... well, we're working with mode 320x200x256, so that means that we have 256 colors to work with, which are 0 through 255. So the highest number that you can enter into the index parameter is 255 and the lowest is 0. Now don't get me wrong here, the number of the color has nothing to do with what the color actually is, it's just a way to place, find and use the color. example:

In one game you may have a color palette that is set up like so:

0=<0,0,0>
1=<1,1,1>
2=<2,2,2>
etc......
64=<1,0,0>
65=<2,0,0>
66=<3,0,0>
etc......
128=<0,1,0>
129=<0,2,0>
130=<0,3,0>
etc......
192=<0,0,1>
193=<0,0,2>
194=<0,0,3>
etc....... until 255

and then you might have another palette in a different game that's set up like this:

0=<3,7,2>
1=<7,2,5>
2=<9,1,3>
etc....... until 255

So as you can see that there are no restrictions as to which color you can put where, it's all up to you. The indexes are just there so that your colors are organized and so that you know where each color is on your color palette.

Now I will show you what the palette changing code does step by step.
The first line of code:

void set_palette(int index, int red, int green, int blue)

just sets up the function and it's parameters.
The second line (which is after the "{"):

outp(RGB_RESET, 0xFF); //Prepare the VGA card for the color change

does exactly what the comment says: it prepares the VGA card for the palette change. But how does it do that? It does that by calling 0xFF (which is a standard bios call which is related to the VGA card) and passing 0x03C6 to it, which tells the VGA card that we want to change the color palette.

The third line of code:

outp(RGB_WRITE, index); //Tell which palette register to write to

passes the value of our variable "index" to 0x03C8 which tells the VGA card which color we want to change.

The fourth line of code:

outp(RGB_DATA, red); //change the red value

passes the value of "red" to 0x03C9. 0x03C9 is a hardware function that takes what ever value is given to it and puts that value into the next color value in line, and in this case since nothing has been edited since we called 0x03C8 it puts the value of "red" into the R color value (remember "RGB"?).

the 5th line of code:

outp(RGB_DATA, green); //change the green value

does the same thing as the 4th except since 0x03C9 HAS been called once, it will now put the value into the G color value instead of the R color value.

the 6th line of code:

outp(RGB_DATA, blue); //change the blue value

changes the B (from RGB) color value.

Color Rotation
Ah, color rotation... the signature of a pro. So what is it? Many older games used it to make it look like water was moving since they couldn't update each pixel on the screen (computers were very slow back then). SO WHAT IS IT!? Color rotation... one of the finest effects one could ever hope to achieve. SSOO WWHHAATT IISS IITT!?!? I really do like color rotation, it makes such great effects... DO YOU SPEAK ENGLISH? WHAT IS COLOR ROTATION!? Oh, I'm sorry... I kind of got cought up in the greatness of... SHUT UP!!!!!!! JUST TELL US WHAT THE DAMN THING IS!!!!!!
Well, color rotation is when you change the color palette to give the affect of movment. example:
You want to make it look like a water fall was actually falling, and lets say you've already used up to many compute cycles to be able to afford to update the screen anymore (yea right, like that could ever happen with a pentium. But this is hypothetical... remember?). So what would you do? Well, all you have to do is make lines of color down the water fall, and each line is a differant color palette index like this:

   90,90,90,90,90,90
   91,91,91,91,91,91
   92,92,92,92,92,92
   93,93,93,93,93,93
   94,94,94,94,94,94
   95,95,95,95,95,95
   96,96,96,96,96,96
   97,97,97,97,97,97

So now we just rotate the colors 90 through 97 so that the RGB value that was in 90 goes into 91 and the RGB value that was in 91 goes into 92, and 93 goes into 94, etc. and then at the end 97 goes back into 90. All you have to do is to do this each frame and it will look like the water fall is falling. Of course strait lines don't look like a water fall, but you get the idea. You can also do it to achieve differant movment effects like a pixel moving across the screen:

90, 91, 92, 93, 94, 95, 96, 97

And now you make the back ground black (0,0,0) and have all except one of the other colors be black also and have the one that's not black be white or somthing like that and then rotate 90 through 97. When you do that it gives the effect that a white pixel is moving accross the screen against a black back ground.

So, what now?
Now you go on to learn how to plot pixels at my pixel plotting docs!

Discuss this article in the forums

Date this article was posted to GameDev.net: 7/16/1999
(Note that this date does not necessarily correspond to the date the article was written)

See Also:
Graphics