Jenny's Hobby Farm

(Previously Webelfin Design)

Jenny's Hobby Farm Home Page

I (Jenny ) used to be an assembler language programmer back in the days of the dinosaurs, nearly 50 years ago. I have written these pages for anyone who is now trying to learn the hex system of numbers that I used to have to interpret on a regular basis in the old days.

(You will need to set your printer to print background colors if you want the colors to show when you print.)

HOW TO CHANGE YOUR COLORS ONE SHADE AT A TIME
using RGB hex codes

(NOTE:   #39 denotes hex number 39 to distinguish it from a decimal number)

Before you can learn to change your colors one shade at a time, you need to be able to count in hex.

See Learn to count in hex or use the Hex to Decimal Conversion Chart

RGB (red, green, blue) color notation is one way of specifying what color you want in a particular application, either in a web page, painting program, photo editing program or anything else.

Three 2-digit hex numbers from 00 to FF are used for RGB hex notation.

The first one is for the red component of the color, the second one is for the green and the third one is for the blue. This notation was chosen because each 2-digit hex number is exactly 1 byte (8 bits) long.

max. red (FF)
no green (00)
no blue (00)
Hex

FF 00 00

#FF0000
no red (00)
max. green (FF)
no blue (00)
Hex

00 FF 00
#00FF00
no red (00)
no green (00)
max. blue (FF)
Hex

00 00 FF
#0000FF

Different colors are made by combining different amounts of each color component. The higher the hex number for a particular component, the more of that component there is in the resultant color. For example, orange is made by combining a lot of red (hex FF), a middling amount of green (hex 99) and a little bit of blue (hex 33)

#FF9933

The 216 web-safe colors restrict each color component to certain hex numbers. These web-safe colors can be displayed on any browser, although most browsers can now display more colors than just the 216 web-safe colors. However, the non-websafe colors may still not display as exactly the same color on different computer screens.

The 216 web-safe colors are various combinations of the following 6 hex numbers:

When you look at the decimal equivalents, you can see that there are actually 51 decimal numbers between each web-safe hex number and the next. These represent 51 different shades of color between one web-safe color and the next.

(From here on, your browser may not be able to see the all the colors. Some browsers are set to change non web-safe colors to the closest web-safe color. I am using the latest version of Firefox in 2015 and I can see all the shades.)

Look below at what happens if I change the blue component of the color by only 1 hex number at a time. The red and green components have been set to zero. You can see that there is hardly any difference between adjacent colors.

Now see what happens if I change the blue component of the color by 17 hex numbers at a time instead. The red and green components are still set to zero. In this case, you can see a noticeable difference between adjacent colors, and the result as shown below is 9 distinct colors, instead of only 3 if I had stuck to web safe colors.

For my own use, I find it sufficient to change each color component by 17 shades at a time, as above.

I use combinations of the following Hex numbers for all the red, green and blue components of my web page colors.

  #00, #11, #22, #33, #44, #55, #66, #77, #88, #99, #AA, #BB, #CC, #DD, #EE, #FF

(Bold numbers are web-safe numbers)