Enroll Course

100% Online Study
Web & Video Lectures
Earn Diploma Certificate
Access to Job Openings
Access to CV Builder



Online Certification Courses

HTML - Colors

HTML Color Tutorial, HTML Tutorial. 

HTML Colors

HTML Colors are vital to offer an honest look and feel to your website. you'll specify colors on page level using <body> tag otherwise you can set colors for individual tags using bgcolor attribute.

The <body> tag has the following element attributes which are useful for setting different colors:

1. bgcolor: is responsible for changing the background color of the page.

2. text: is responsible for setting the color of the body text.

3. alink: is responsible for setting a color for active links or selected links.

4. link: is responsible for setting the color for linked text.

5. vlink: is responsible for setting a color for visited links i.e, for a linked text that has already been clicked on.

 HTML Color Coding Methods

There are following three different methods to set colors on your web page:

1. Color names: You can directly set color names directly like green, blue or red.

2. Hex codes: This is a six-digit code that represents the amount of red, green, and blue that a color consists of.

3. Color decimal or percentage values: This value is set by using the rgb( ) property.

Now we will see how these color schemes look like one after the other

HTML Colors - Color Names

You can directly specify the name of a color to line text or background color. The W3C has helped in listing 16 basic color names which will always validate with an HTML validator. There are currently over 200 different color names that are supported by the major browsers.

W3C Standard 16 Colors

Here is a comprehensive list of W3C Standard 16 Colors names and it is highly recommended to use them.

Example

The following code will set the background color of the body, text and font elements

<!DOCTYPE html>
<html>

   <head>
      <title>HTML Colors by Name</title>
   </head>
	
   <body text = "blue" bgcolor = "green">
      <p>Use different color names for for body and table and see the result.</p>
      
      <table bgcolor = "black">
         <tr>
            <td>
               <font color = "white">This text will appear white on black background.</font>
            </td>
         </tr>
      </table>
   </body>
   
</html>

HTML Colors - Hex Codes

Hex code is a six-digit code that represents a color. the main two digits(RR) represent a red value, the remaining two are a green value(GG), and the last is the blue value(BB).

Hexadecimal code is often taken from any graphics software like Adobe Photoshop, Paintshop Pro or MS Paint.

A pound or hash sign # precedes every hexadecimal value.

The following are a list of few colors using Hex code

Color Color HEX
  #000000
  #FF0000
  #00FF00
  #0000FF
  #FFFF00
  #00FFFF
  #FF00FF
  #C0C0C0
  #FFFFFF

Example

The following shows how to use Hex code to specify colors:

<!DOCTYPE html>
<html>

   <head>
      <title>HTML Colors by Hex</title>
   </head>
	
   <body text = "#0000FF" bgcolor = "#00FF00">
      <p>Use different color hexa for for body and table and see the result.</p>
      
      <table bgcolor = "#000000">
         <tr>
            <td>
               <font color = "#FFFFFF">This text will appear white on black background.</font>
            </td>
         </tr>
      </table>
   </body>
   
</html>

Browser Safe Colors

Below is a comprehensive list of 216 colors that are supposed to be safest and computer independent colors. These special colors very from hexadecimal code 000000 to FFFFFF and they are supported by all machines using the 256 color palette. 

HTML Color Codes

Corporate Training for Business Growth and School