Saturday, February 08, 2014

Understanding HTML Colors



Standard Color of HTML


A single blog post can never provide you the sufficient knowledge on HTML colors. Thousands of words could be written about colors. But today, I'm just gonna share my little knowledge about HTML colors

All of you are familiar with the basic colors - Red, Green & Blue. In brief, this is known as RGB. What you see in the screen is nothing but the combination of these three colors. I mean Red, Green and Blue. 


There are 16 Million Different Colors!

The combination of Red, Green and Blue can produce more than 16 million colors! Each color has a value from 0 to 255. Couple of years ago I heard that human eyes can detect almost 17000 colors. And most of the modern monitors are capable of displaying more than 16000 colors. 


Color Names Supported by the Web Browsers

There are 140 color names defined by the HTML and CSS color specification which are supported by almost all web browsers. But only 17 of them are considered as standard colors. These are as follows:
Aqua, Black, Blue, Fuchsia, Gray, Green, Lime, Maroon, Navy, Olive, Orange, Purple, Red, Silver, Teal, White, Yellow. 
Look at the table below. 17 standard colors are shown with Hexadecimal values. 


Color Name
HEX
 Color
Aqua
00FFFF 
          
Black 
000000
       
Blue 
0000FF

Fuchsia 
FF00FF

Gray 
808080

Green 
008000

Lime 
00FF00

Maroon 
800000

Navy 
000080

Olive 
808000

Orange 
FFA500

Purple 
800080

Red 
FF0000

Silver 
C0C0C0

Teal 
008080

White 
FFFFFF

Yellow 
FFFF00
                                              


Understanding the Color Values

The web browsers can't see as we human do. We can see Red, Green, Blue, Black or White. But a browser don't see anything. But it can take color value as input and show color as output. 

So, when something is created to be displayed through web browsers the web developers must input the codes. Thus when are working with HTML or CSS colors you should have a basic idea about color codes. 

RGB colors are defined by the HEX code. If you work in photoshop you should know the formation of colors. When you pick a color in photoshop you will see the value of each color. If you choose fully red color, the value of R will be 255. And the value of G and B will be 0. And the HEX code will be #ff0000.

HEX Values are written as 3 double digit numbers starting with the # sign. The lowest value that can be given to a color is 0 (Hex 00). And the highest value is 255 (Hex FF). So when you choose a complete Red, the RGB code will be 255, 0, 0. And the HEX code will be ff0000. Here ff is for 255, and 00, 00 is for 0 and 0. 

When you choose complete white, RGB will be 255, 255, 255. Then you will get HEX code as ffffff. And if you choose black then you will get the opposite code. RGB will be 0, 0 0. The HEX code is 000000. That means white includes all the three basic colors. And black includes none of the colors. 


Example Color Values

  • White: Hex Code - #FFFFFF, RGB (255, 255, 255)
  • Black: Hex Code - #000000, RGB (0, 0, 0)
  • Red: Hex Code - #FF0000, RGB ((255, 0, 0)
  • Green: Hex Code - # 00FF00, RGB (0, 255, 0)
  • Blue: Hex Code - # 0000FF, RGB (0, 0, 255)
  • Yellow: Hex Code - # FFFF00, RGB (255, 255, 0)
  • Aqua: Hex Code - # 0000FF, RGB (0, 255, 255)
  • Fuchsia: Hex Code - #FF00FF, RGB (255, 0, 255)
  • Silver: Hex Code - #C0CoCo, RGB (192, 192, 192)

Hopefully this color values will clarify your understanding of HTML color codes. 



Stay with Marks PC Solution to get more interesting IT topics!


No comments:

Post a Comment