Color Hexadecimal Values

Color values used on HTML pages and Java (TM) applets are represented as six character hexadecimal values, where “000000” is pure black, “FFFFFF” is pure white, and ever other possible color combination can be found in between. 

To use colors with Java (TM) applets you must either use this online applet, or follow these easy instructions below if you fancy delving into the whys and wherefores.

The six digits in each color value can be split into three 2 character Red, Green and Blue values.  So, a value of “112233” means a Red value of 11, a Green value of 22 and a Blue value of 33. 

A note on Hexadecimal representation : 

As humans with, generally speaking, 10 fingers and 10 toes, we are used to the decimal number system, that is, a ten digit number system starting at 0 and going up to 9.  When we reach 9, we “roll over” back to zero again and, of course, add a 1 to the left hand side to give 10. 

Whereas decimal has ten values per digit, hexadecimal has sixteen values per digit.  The standard ten from 0 to 9, but then of course we run out of occidental numbers.  So, we start using letters …. A for value 10, B for 11, C for 12, D for 13, E for 14 and F for 15.  Once we reach ‘15’ (or F) we “roll over” back to zero again, and add that one to the left, giving 10 (which is the equivalent of value 16 in decimal) 

Here are a few example of hexadecimal (or “hex”) values and decimal values : 

Hex 1 = Decimal 1
Hex 9 = Decimal 9
Hex A = Decimal 10
Hex 10 = Decimal 16
Hex 1F = Decimal 31
Hex FF = Decimal 255

So, how do we turn “slightly light blue” into a series of 6 hexadecimal characters ?

 Well, the easiest way to do this, if you have a Windows operating system, is using the Paint package.   Open up Paint, then choose the menu options Colors / Edit Colors.  Click on the Define Custom Colors button to bring the color wheel up like this :

 Choose the desired color you are after using the large color area, and chose the shade using the slider on the right.  Here we have chosen that light blue color we love so much. 

On the bottom right hand side you can see that there are three values – Red, Green and Blue.  But these values are represented in decimal (not hex) which is no use for web work.   We know our RGB values, we just need to convert them to hex !

 The easiest way to do this is as follows.  Let’s take the Red value, 84.  Divide 84 by 16 to get 5.25.  At this point all we are bothered about is the integer part of this result, i.e. the 5.  That’s our first digit.   Take the 5 and times that by 16 to give 80.  Take 80 from the original number (84) to give a remainder of 4.  That’s our second digit.  So, the two characters which represent Red in hexadecimal is “54”.

 Carry on and do the same for Green and Blue.  Let’s work through Green first.  175 / 16 = 10.9375.  Forget the .9375 and concentrate on 10.  We already know that in hex the value 10 is represented by the letter A so ‘A’ is our first digit.  10 * 16 = 160.  175 – 160 equals a remainder of 15.  15 we know is F in hex.  So, our Green value is ‘AF’ 

Finally blue.  203 / 16 = 12.6875.  Drop the .6875 to give 12, which is ‘C’.  12 * 16 = 192.  203 – 192 = 11 (or ‘B’).  So, our Green value is ‘CB’

 Put the three values together, and we arrive at a color value for “slightly light blue” of “54AFCB” ….. result !

 If this seems a little long winded or complicated, don’t worry.  Try this a few times, and pretty soon this will become second nature.

 Examples :

                              Black                          000000
                              White                          FFFFFF
                              Light Gray                  B0B0B0
                              Dark Gray                  808080
                              Red                             FF0000
                              Green                         008000
                              Blue                            0000FF
                              Dark Blue                   000080
                              Bright Green              00FF00
                              Purple                         800080
                              Light Purple               FF00FF
                              Brown                         800000
                              Cyan                           00FFFF
                              Yellow                         FFFF00

Online Color Picker Applet

Use the following applet to generate hexadecimal color values to use with your applets (Note : remove the # from the value before you use the value in a parameter in html)

URL Targets

URL Target Window parameters specify which browser window the destination URL will open up in, when the user clicks on a menu option or graphic (depending on the applet in question).

Valid values :

_blank – open in a brand new window, leaving this window still open

_top – open in the current window, whole page

_self – open in the current frame.  Only really used when using frames on your page.

_parent -  open in the parent window.

The most commonly used options will be _blank (new window) and _top (same window) which should cater for most scenarios.

[home]   [products]   [site map]   [license information]   [support]   [links]

Support

Having problems ?  Can't get it to work ? Confused ? We're here to help !  Click here for our Support Page

[Java (TM) Trademark Disclaimer - click here]
Java and all Java-based marks are a trademark or registered trademark of Sun Microsystems, Inc, in the United States and other countries.
[Copyright © 1997 - 2004 Fugazi Consulting Limited - All rights reserved. ]