In this laboratory students will explore the use of red, green, and blue light to generate colors. Students will also become acquainted with the hexadecimal number system. The environment in which these will be explored will be computer based HTML.
The colors of a computer monitor can be turned on and off, with the brightness controlled by a number between 0 (off) and 255 (full on). Computers, however, do not usually count in base ten. Our computers work in base 16. Base 16 is called hexadecimal. The following table shows the base ten number and the corresponding hexadecimal numbers.
Base 10 | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Base 16 | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | A | B | C | D | E | F | 10 |
The colors are controlled by a two digit hexadecimal number between 00 (off) and FF (full on):
00 01 02 03 04 05 06 07 08 09 0A 0B 0C 0D 0E 0F |
10 11 12 13 14 15 16 17 18 19 1A 1B 1C 1D 1E 1F |
20 21 22 23 24 25 26 27 28 29 2A 2B 2C 2D 2E 2F |
30 31 32 33 34 35 36 37 38 39 3A 3B 3C 3D 3E 3F |
40 41 42 43 44 45 46 47 48 49 4A 4B 4C 4D 4E 4F |
50 51 52 53 54 55 56 57 58 59 5A 5B 5C 5D 5E 5F |
60 61 62 63 64 65 66 67 68 69 6A 6B 6C 6D 6E 6F |
70 71 72 73 74 75 76 77 78 79 7A 7B 7C 7D 7E 7F |
80 81 82 83 84 85 86 87 88 89 8A 8B 8C 8D 8E 8F |
90 91 92 93 94 95 96 97 98 99 9A 9B 9C 9D 9E 9F |
A0 A1 A2 A3 A4 A5 A6 A7 A8 A9 AA AB AC AD AE AF |
B0 B1 B2 B3 B4 B5 B6 B7 B8 B9 BA BB BC BD BE BF |
C0 C1 C2 C3 C4 C5 C6 C7 C8 C9 CA CB CC CD CE CF |
D0 D1 D2 D3 D4 D5 D6 D7 D8 D9 DA DB DC DD DE DF |
E0 E1 E2 E3 E4 E5 E6 E7 E8 E9 EA EB EC ED EE EF |
F0 F1 F2 F3 F4 F5 F6 F7 F8 F9 FA FB FC FD FE FF |
The following is a table of some of the more useful values, although any value from 00 to FF could be used:
Brightness | Value | Brightness | Value |
---|---|---|---|
Off | 00 | Two thirds | AA |
One quarter | 40 | Three quarters | C0 |
One third | 55 | Full on | FF |
One half | 80 |
The colors are arranged in the order red, green, blue. Three colors with two digits each is a six digit number: RRGGBB. Thus the command "FF0000" would turn the red lights on full while commanding the green and blue lights to turn off. The command "8055FF" would turn the red lights on half way, the green lights on one third, and the blue lights on full.
Click here to start a viewing loop in the following sequence: white, grey, black, red, green, blue... Use a magnifying glass to examine the screen the screen closely.
Getting the computer to actually process the color number command will require enclosing the command in a simple program. We will use HTML to work with our colors. To program HTML open up the note pad on the computer.
In note pad you will have to type the following exactly as it is typed below:
<html> <body bgcolor="#FF0000"> </body> </html>
Note the # sign in front of the hexadecimal number: this tells the computer that it is about to get a hexadecimal number.
Save the file in the My Documents folder using your lower-case first name followed by a period, the letters html, all enclosed in a quote. If your name is Emmalyn, save the file as "emmalyn.html". Be sure to include the quotes! Do not close your document.
Use the My Documents item on the Start: Programs menu to find your document. Double click your document, it should open in a browser.
What color came up in the browser?
Return the notepad. Change the line <body bgcolor="#FF0000"> in the following ways, each time returning to the browser and clicking on "Reload" to view the changes.
In the RGB system...
SC 130 Home page
Lee Ling's Courses Home Page
To COM-FSM Home Page