Instructor: Jeffrey Horn
(see page on BINARY NUMBERS first)
| Base | Numbers | |||||||||||
| 10 (decimal) | 0 | 1 | 2 | 3 | 4 | 5 | 6 | ... | 252 | 253 | 254 | 255 |
| 2 (binary) | 00000000 | 00000001 | 00000010 | 00000011 | 00000100 | 00000101 | 00000110 | ... | 11111100 | 11111101 | 11111110 | 11111111 |
Note how long binary numbers get, quickly.
Humans find it difficult to read and write such numbers.
So we have developed a "compromise" by using hexadecimal numbers as SHORTHAND for binary numbers.
Hex is used by HTML, so we need to know it!
|
System |
Representation |
| Decimal (the actual value) | 76 |
| Binary (single byte) | 01010110 |
| Binary (2 nibbles) | 0101 0110 |
| Hex (2 hex numbers) | 5 6 |
| Hex (final html syntax) | #56 |
The basic idea is to break off 4 bits at a time (a nibble or nybble).
Represent each 4-bit section by a single hex symbol.(character)
This shrinks the symbol string by a factor of 4!
Makes it much easier and faster to read, write, and compare computer data without going very far from the actual representation in hardware.
BUT...we don't have enough symbols (from our base 10 alphabet) for all possible nibbles!
4 bits means we can represent 24 = 16 values, from 0 to 15 (that is, 0000 to 1111).
PROBLEM: We only have 10 numerals (0..9). We need 6 more!
SOLUTION: "Steal the first 6 letters from the alphabet (A..F)
| Base | Alphabet (set of symbols) |
| 10 (decimal) | 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 |
| 2 (binary) | 0, 1 |
| 16 (hex) | 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F |
| Base | Numbers | |||||||||||||||
| 10 (decimal) | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
| 2 (binary) | 0000 | 0001 | 0010 | 0011 | 0100 | 0101 | 0110 | 0111 | 1000 | 1001 | 1010 | 1011 | 1100 | 1101 | 1110 | 1111 |
| 16 (hex) | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | A | B | C | D | E | F |
Now we can represent all 16 possible values of a half of a byte (4 bits) with a single hex numeral.
|
System |
Representation |
| Decimal (the actual value) | 90 |
| Binary (single byte) | 01011010 |
| Binary (2 nibbles) | 0101 1010 |
| Hex (2 hex numbers) | 5 A |
| Hex (final html syntax) | #5A |
Hex numbers are typically written as: #5A (HTML)
So #00 is smallest byte (all 0's), and #FF is largest (all ones), with #80 being about in the middle.
| Language | Single Byte Numbers | |||||||||
| JavaScript | 0 | 1 | 2 | ... | 128 | ... | 252 | 253 | 254 | 255 |
| HTML | #00 | #01 | #02 | ... | #80 | ... | #FC | #FD | #FE | #FF |
| machine code (binary) | 0000 0000 | 0000 0001 | 00000010 | ... | 1000 0000 | ... | 1111 1100 | 1111 1101 | 1111 1110 | 1111 1111 |
For RGB, we need 3 hex numbers of two hex numerals each: #R1R2G1G2B1B2
So in HTML we would specify BRIGHT RED as #FF0000
So in HTML we would specify BRIGHT GREEN as #00FF00
So in HTML we would specify BRIGHT BLUE as #0000FF
Try customizing colors (to get hex number for HTML) in:
MS Paint
MS FrontPageu
http://johndyer.name/lab/colorpicker/ (thanks, Scott)
Copyright 2008 Jeff Horn. (last updated January 28, 2007)