Manuscript for HTML Tutorial #13

Listed below is the manuscript of all textual instructions used in HTML Tutorial #13 - Changing Color Using the RGB Color Model. Most of this text is displayed inside the yellow balloons used to guide viewers as they watch the lessons.

Students and instructors may find it helpful to have a hard copy of these balloon instructions. You may print this web page to use as an aide in following, referencing, or demonstrating the web design series.

Manuscript Table of Contents

Entire HTML Tutorial Series

Tutorial #13 - Changing Color Using the RGB Color Model

Lesson #13: The RGB Color Model. In our last three lessons on using style, we changed the color of our text by specifying a color name (i.e. red, green, blue). There are over a hundred different color names that can be applied, depending on the type of web browser being used. However, only 16 of those color names are officially recognized. If you want to use a color other than one of the basic 16, it is recommended that you specify that color using the RGB color model. This will give you a much larger range of colors that will be more universally supported by different web browsers. In this lesson, we will learn how to apply RGB color. Click the play button to begin the tutorial.
A computer monitor displays different colors by using three types of light...
Red
Green
& Blue
This is known as RGB color. RGB stands for Red, Green, Blue.
The amount of light from each source is indicated by a value ranging from 0–255.
A value of 0 (zero) means the light is off.
When all three lights are off, the monitor shows black.
As a color’s value increases, so does its intensity.
When all three light sources are at full intensity (255), the monitor shows white.
Making other colors is simply a matter of adjusting the intensity (value) of your three source colors.
Watch now as we show you some examples.
To use this color, we can just tell our web page its three RGB values.
One way is to add a style rule that uses the RGB functional notation.
The three values need to be in the order of red, green, blue, enclosed in parenthesis, and separated by commas.
Plus don’t forget to include rgb.
Another method involves using the hexadecimal notation.
Here we’ve used a six character code preceded by a ‘#’.
The first two characters in the code represent red.
The middle two characters are green.
And the last two characters are blue.
You’ll notice that some of the characters are numbers, and some are letters.
In the hexadecimal system, the letters a-f are used to represent the numbers 10-15.
So the hexadecimal number ‘ff’ is equal to the decimal number ‘255’.
Because, f x 16, or 15 x 16 = 240. Then, 240 + f, or 240 + 15 = 255.
Don’t worry if these numbering systems seem confusing. You can always use the conversion charts in the Color area of our references section.
In our next Lesson #14, we will see how to change our web page’s background, using the RGB color model.

<<<Tutorial #12

Tutorial #14>>>