Numeric systems are fundamental to all computer information, more accurately it's how we use the information. There is an infinite amount of numeric systems, but we are only going to cover three major ones which are commonly used with computers. Once you understand the fundamentals of how numeric systems work you will understand any numeric system.
We are going to look at:
I’m going to show you how we can use these different numeric systems to represent colors but look at my article on Encoding to see how it works with representing text. Now remember computer screens only display Red, Green and Blue, or RGB. ie this yellow background is not emitting any yellow light... you've been duped. If you are wondering why your eye sees yellow watch the short video below.
The Decimal system
Let’s start with the decimal system because it is the one we are all familiar with. If we count up... 0,1,2,3,4,5,6,7,8,9. We have reached the maximum amount of values we can fit on one place holder because if I count up one more, we get 10 which is now taking up two place holders. The name decimal is derived from Greek "deka" meaning 10, so this is also known as a base 10. As a developer you should be comfortable with the idea that even though we have counted to 9 we really have a count of 10 because of the 0.
So each place holder holds 10 values. After 10 values we tick up the next place holder which also holds 10 values. then we tick up the next place holder and so on.
In computing we often use decimal values to represent information. for example::
- R = 0 - 255
- G = 0 - 255
- B = 0 - 255
As you can see 255 is the max value we use for colors... if you dont know why that is, then hold on to your hat because here we go...
The Binary system
Computers work with transistors, circuits, electricity and all that good stuff which only have two states (on and off). Giving us a binary numeric system to work with. Binary like “Bi” meaning 2 is a Base 2 numeric system.
So with the binary numeric system we can fit a maximum of 2 values on a place holder 0 and 1. then we have to count up the next placeholder.
With the decimal system each time a place holder moves up it is multiplying by 10 eg 1 x 10 = 10, 10 x 10 = 100, 100 x 10 = 1000. With binary each a place holder moves up it is multiplying by 2 eg (1)1 x 2 = (10)2, (10)2 x 2 = (100)4, (100)4 x 2 = (1000)8.
Note: by placing a 1 in a place holder you can simply add it's value.
The below example has a 1 in the 4th place holder from the right which equals 8. therefore 1000 = 8
If we wanted the decimal number 99 we would need to add 64, 32, 2, and 1 by putting 1s in the place holders which add up to 100. therefore 100 = 1100100
If you add them all(binary 11111111). 128 + 64 + 32 + 16 + 8 + 4 + 2 + 1 = holy crap it's 255 just like our colors
So the numbers adding up to 255 come from binary:
- R = 0 - 11111111
- G = 0 - 11111111
- B = 0 - 11111111
A single binary digit which can be 1 or 0, is known as a bit.It is the smallest piece of information in computing. Bits are packed together so that we can count higher. If there are ten 1's packed together how do we known if it's meant to represent "31" "31"(11111 11111) or "1023"(1111111111). So a standard of chunking bits into groups of 8 was reached which is called a byte. Why was 8 chosen for a byte? Theres a long history on that which you read about on wikipedia: Byte.
But wait I thought a byte was 256 bits? 11111111 = 255, including the 0 gives us 256. We add the 0 because 00000000 can still represent something.
The Hexadecimal system
Hex meaning 6 and dec meaning 10, so this is a base 16 numeric system. If the decimal system counts 10 and the binary system counts 2, the hexidecimal system counts to 16. The name Hexadecimal is often shorten to be called "hex codes".
So on the first place holder we count 0 1 2 3 4 5 6 7 8 9 thats ten numbers only… how the hell do we continue to count up on the same place holder… well we use the first 6 letters of the alphabet... a b c d e f. So the first place holder counts up to 16 then ticks up the next place holder.
- R = 00 - FF
- G = 00 - FF
- B = 00 - FF
Hexadecimal is used extensively in encoding.I give a few examples in myEncoding post. Hexadecimal is often used for colors, eg #A82E1B. # indicates we are dealing with hex codes for colors. Then there are three sets of 2 representing RGB. eg #A82E1B R=(A8) G=(2E) B=(1B)
- Black = #000000
- Red = #FF0000
- Green = #00FF00
- Blue = #0000FF
- Yellow = #FFFF00
- Teal = #00FFFF
- Magenta = #FF00FF
- White = #FFFFFF