0% found this document useful (0 votes)
93 views

2 HTML Color Codes

The document discusses color codes used in web development. It explains that RGB and hexadecimal color codes are used to specify colors by defining levels of red, green, and blue. RGB uses values from 0-255 for each color, while hexadecimal uses values from 00-FF. Common colors like black, white, red, green and blue are provided as examples. The HSL model is also covered, using hue, saturation and lightness values to define a color.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
93 views

2 HTML Color Codes

The document discusses color codes used in web development. It explains that RGB and hexadecimal color codes are used to specify colors by defining levels of red, green, and blue. RGB uses values from 0-255 for each color, while hexadecimal uses values from 00-FF. Common colors like black, white, red, green and blue are provided as examples. The HSL model is also covered, using hue, saturation and lightness values to define a color.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
You are on page 1/ 19

Color Codes

1
Color Codes
• Colors are set using “RGB” color codes,
which are, represented as hexadecimal
values.

• Each 2-digit section of the code represents


the amount, in sequence, of red, green or
blue that forms the color. For example, a
RGB value with 00 as the first two digits has
no red in the color.
2
Main Colours

3
Main Colours
 The total number of different colors that can be produced

(28)3= 256 x 256 x 256 = 16,777,216 colors


Main Colours
RGB
• rgb(red, green, blue)

• Each parameter (red, green, and blue) defines the


intensity of the color with a value between 0 and 255.

6
RGB
• For example, rgb(255, 0, 0) is displayed as red, because
red is set to its highest value (255), and the other two
(green and blue) are set to 0.

• Another example, rgb(0, 255, 0) is displayed as green,


because green is set to its highest value (255), and the
other two (red and blue) are set to 0.

• To display black, set all color parameters to 0, like this:


rgb(0, 0, 0).

• To display white, set all color parameters to 255, like this:


rgb(255, 255, 255).

7
RGB

8
9
HEX - hexadecimal value
• Where rr (red), gg (green) and bb (blue) are hexadecimal values
between 00 and ff (same as decimal 0-255).

• For example, #ff0000 is displayed as red, because red is set to


its highest value (ff), and the other two (green and blue) are set
to 00.

• Another example, #00ff00 is displayed as green, because green


is set to its highest value (ff), and the other two (red and blue)
are set to 00.

• To display black, set all color parameters to 00, like this:


#000000.

• To display white, set all color parameters to ff, like this: #ffffff.
10
HEX

11
12
HSL
• hsl(hue, saturation, lightness)

• Hue is a degree on the color wheel from 0 to


360. 0 is red, 120 is green, and 240 is blue.

• Saturation is a percentage value. 0% means a


shade of gray, and 100% is the full color.

• Lightness is also a percentage value. 0% is


black, and 100% is white.
13
HSL

14
15
16 Basic Colors

16
Color Codes
1. WHITE 1. #FFFFFF
2. BLACK 2. #000000
3. RED 3. #FF0000
4. GREEN 4. #00FF00
5. BLUE 5. #0000FF
6. MAGENTA 6. #FF00FF
7. CYAN 7. #00FFFF
8. YELLOW 8. #FFFF00
9. AQUAMARINE 9. #70DB93
10. BAKER’S CHOCOLATE 10. #5C3317
11. VIOLET 11. #9F5F9F
12. BRASS 12. #B5A642
13. COPPER 13. #B87333
14. PINK 14. #FF6EC7
15. ORANGE 15. #FF7F00 17
Color Codes
 If you require more information about color
values, there is an excellent site entitled
“VGDesign’s Interactive Color Cube” that
displays the background color code when
you put your cursor over a small color
sample. The Web address is :
http://www.vgdesign.com/color.html

18
The Body Element
• The BODY element of a web page is an
important element in regards to the page’s
appearance. Here are the attributes of the
BODY tag to control all the levels:
TEXT="#RRGGBB"  to change the color of all
the text on the page (full page text color.)
 This element contains information about the
page’s background color, the background
image, as well as the text and link colors.

19

You might also like