Dave's Site - Millions Served.
<Table of Contents>
HTML Tutorial Chapters:  

HTML5 Basics - Web Hosting Ideas - CSS, Web Design, HTML, JQuery - Twitter - Learn on your iPad

HTML Tutorial
HTML Code ColorChapter: Using Color Codes
Be rewarded 
the Web's Premiere Rewards Site

Using Hexadecimal Color Codes with HTML and CSS: Part 2

Go Back to Part 1, Basics of Hexadecimal Colors!

The hexadecimal color code system described in part one is used extensively in HTML and CSS coding, and is also used in graphics applications like Adobe Photoshop and the GIMP. An easy way to pick a hexadecimal color use to use the eye-dropper on an image in one of these programs, and copy the hex color code out, then paste it into your HTML or CSS file.

In traditional HTML, the color codes can be used in the bgcolor and color areas of your code, as follows:

  • For Page Backgrounds: <body bgcolor="#hexdec">
  • For Text Colors: <font color="#hexdec">
  • For Page-Wide Link and Text Colors:
    <body text="#hexdec" link="#hexdec" vlink="#hexdec" alink="#hexdec">
    (Where text is text color, link is non-visited link color, vlink is already-visited link color, and alink is the color a link turns at the moment it is clicked.)

In the examples above, replace #hexdec with your actual hexadecimal color code.

In CSS coding, you can use the color code for the color: and background-color: properties. For example, if you want all of your H1 headings to be red, you would use this in your CSS file:

 h1 { color: #FF0000; }

If you are just learning HTML right now, I'd encourage you to visit the CSS tutorial next, it'll save you a lot of time and hassle as you create web sites!

There is no need to memorize the specific colors. You can always look up color choices with special hexadecimal color pickers available free at many web sites. Here are just a few:

For historical reference, when the web first started, most computer screens couldn't display millions of colors, so we had to stick with 216 colors that were called "web safe" colors. If you'd like to learn about web safe colors, click here.

Download the app that replaced this guide,
Web Design Basics for iPad to
Learn HTML and CSS Quickly.
Return to the Beginner's HTML Tutorial!
Copyright © Dave Kristula. All rights reserved. Follow me on Twitter @firstdave
URL: http://www.davesite.com/webstation/html/hexchart_html_css_code.shtml