1 / 49

Hexadecimal Number System

Hexadecimal Number System. CS 1 Rick Graziani Cabrillo College Spring 2007. Pixels. A monitors screen is divided into a grid of small unit called picture elements or pixels . The more pixels per inch the better the resolution, the sharper the image.

tuari
Download Presentation

Hexadecimal Number System

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Hexadecimal Number System CS 1 Rick Graziani Cabrillo College Spring 2007

  2. Rick Graziani graziani@cabrillo.edu

  3. Rick Graziani graziani@cabrillo.edu

  4. Pixels • A monitors screen is divided into a grid of small unit called picture elements or pixels. • The more pixels per inch the better the resolution, the sharper the image. • All colors on the screen are a combination of red, green and blue (RGB), just at various intensities. Rick Graziani graziani@cabrillo.edu

  5. Rick Graziani graziani@cabrillo.edu

  6. Dreamweaver Rick Graziani graziani@cabrillo.edu

  7. With web applications like HTML (Hypertext Markup Language), colors are sometime described using their RGB color specification in hexadecimal. <tr> <td rowspan="2" bgcolor="#cccc99">&nbsp;</td> <td height="30" bgcolor="#999966"><div id="mainnav"> Hexadecimal Number Rick Graziani graziani@cabrillo.edu

  8. Hexadecimal REDGREENBLUE <td rowspan="2" bgcolor="#cccc99">&nbsp;</td> RedGreenBlue cccc99 <td height="30" bgcolor="#999966"><div id="mainnav"> RedGreenBlue 999966 # means hexadecimal in web applications Rick Graziani graziani@cabrillo.edu

  9. Hexadecimal Numbers • What are they? • Why do these people use them? • web designers • digital medial creators • computer scientists • networking professionals Rick Graziani graziani@cabrillo.edu

  10. Rick’s Number System Rules • All digits start with 0 • A Base-n number system has n number of digits: • Decimal: Base-10 has 10 digits • Binary: Base-2 has 2 digits • Hexadecimal: Base-16 has 16 digits • The first column is always the number of 1’s • Each of the following columns is n times the previous column (n = Base-n) • Base 10: 10,000 1,000 100 10 1 • Base 2: 16 8 4 2 1 • Base 16: 65,5364,096256161 Rick Graziani graziani@cabrillo.edu

  11. Hexadecimal Digits Hexadecimal: 16 digits DecHex 0 1 2 3 4 5 6 7 DecHex 8 9 10 11 12 13 14 15 Rick Graziani graziani@cabrillo.edu

  12. Hexadecimal Digits Hexadecimal: 16 digits DecHex 0 0 1 1 2 2 3 3 4 4 5 5 6 6 7 7 DecHex 8 8 9 9 10 A 11 B 12 C 13 D 14 E 15 F Rick Graziani graziani@cabrillo.edu

  13. 0, 1, 2, 3, 4, 5, 6, 7 ,8, 9, A, B, C, D, E, F Hexadecimal Decimal16’s1’s 8 9 10 14 15 16 Rick Graziani graziani@cabrillo.edu

  14. 0, 1, 2, 3, 4, 5, 6, 7 ,8, 9, A, B, C, D, E, F Hexadecimal Decimal16’s1’s 8 8 9 9 10 A 14 E 15 F 16 10 Rick Graziani graziani@cabrillo.edu

  15. 0, 1, 2, 3, 4, 5, 6, 7 ,8, 9, A, B, C, D, E, F Hexadecimal Decimal16’s1’s 17 20 21 26 12 29 Rick Graziani graziani@cabrillo.edu

  16. 0, 1, 2, 3, 4, 5, 6, 7 ,8, 9, A, B, C, D, E, F Hexadecimal Decimal16’s1’s 17 1 1 20 1 4 21 1 5 26 1 A 12 C 29 1 D Rick Graziani graziani@cabrillo.edu

  17. 0, 1, 2, 3, 4, 5, 6, 7 ,8, 9, A, B, C, D, E, F Hexadecimal Decimal16’s1’s 30 31 32 33 50 60 Rick Graziani graziani@cabrillo.edu

  18. 0, 1, 2, 3, 4, 5, 6, 7 ,8, 9, A, B, C, D, E, F Hexadecimal Decimal16’s1’s 30 1 E 31 1 F 32 2 0 33 2 1 50 3 2 60 3 C Rick Graziani graziani@cabrillo.edu

  19. Don’t forget why we are doing this! <tr> <td rowspan="2" bgcolor="#cccc99">&nbsp;</td> <td height="30" bgcolor="#999966"><div id="mainnav"> Hexadecimal Number Rick Graziani graziani@cabrillo.edu

  20. Why Hexadecimal? • Hexadecimal is perfect for matching 4 bits. • Every combination of 4 bits can be matched with one hex number. • 4 bits can be represented by 1 Hex value • 8 bits can be represented by 2 Hex values Rick Graziani graziani@cabrillo.edu

  21. Hexadecimal Digits 4 bits can be represented by 1 Hex value DecHex Binary 8421 8 8 9 9 10 A 11 B 12 C 13 D 14 E 15 F Hexadecimal: 16 digits DecHex Binary 8421 0 0 1 1 2 2 3 3 4 4 5 5 6 6 7 7 Rick Graziani graziani@cabrillo.edu

  22. Hexadecimal Digits 4 bits can be represented by 1 Hex value DecHex Binary 8421 8 8 1000 9 9 1001 10 A 1010 11 B 1011 12 C 1100 13 D 1101 14 E 1110 15 F 1111 Hexadecimal: 16 digits DecHex Binary 8421 0 0 0000 1 1 0001 2 2 0010 3 3 0011 4 4 0100 5 5 0101 6 6 0110 7 7 0111 Rick Graziani graziani@cabrillo.edu

  23. Hexadecimal Digits 4 bits can be represented by 1 Hex value • Hexadecimal is perfect for matching 4 bits. • Every combination of 4 bits can be matched with one hex number. • 4 bits can be represented by 1 Hex value • 8 bits can be represented by 2 Hex values Dec. Hex. Binary Dec. Hex. Binary 0 0 0000 8 8 1000 1 1 0001 9 9 1001 2 2 0010 10 A 1010 3 3 0011 11 B 1011 4 4 0100 12 C 1100 5 5 0101 13 D 1101 6 6 0110 14 E 1110 7 7 0111 15 F 1111 Rick Graziani graziani@cabrillo.edu

  24. Converting Decimal, Hex, and Binary Dec. Hex. Binary Dec. Hex. Binary 0 0 0000 8 8 1000 1 1 0001 9 9 1001 2 2 0010 10 A 1010 3 3 0011 11 B 1011 4 4 0100 12 C 1100 5 5 0101 13 D 1101 6 6 0110 14 E 1110 7 7 0111 15 F 1111 ----------------------------------------------------- Dec. Hex BinaryDec. Hex BinaryDec. Hex Binary 0 0010 10 F 1110 12 A 0000 5 C 0010 1000 Rick Graziani graziani@cabrillo.edu

  25. Converting Decimal, Hex, and Binary Dec. Hex. Binary Dec. Hex. Binary 0 0 0000 8 8 1000 1 1 0001 9 9 1001 2 2 0010 10 A 1010 3 3 0011 11 B 1011 4 4 0100 12 C 1100 5 5 0101 13 D 1101 6 6 0110 14 E 1110 7 7 0111 15 F 1111 ----------------------------------------------------- Dec. Hex BinaryDec. Hex BinaryDec. Hex Binary 0 0 0000 22 0010 10 A 1010 15 F 111114 E 1110 12 C 1100 10 A 10100 0 0000 5 5 0101 12 C 11002 2 0010 8 8 1000 Rick Graziani graziani@cabrillo.edu

  26. What about 8 bits? Dec. Hex. Binary Dec. Hex. Binary 0 0 0000 8 8 1000 1 1 0001 9 9 1001 2 2 0010 10 A 1010 3 3 0011 11 B 1011 4 4 0100 12 C 1100 5 5 0101 13 D 1101 6 6 0110 14 E 1110 7 7 0111 15 F 1111 ----------------------------------------------------- HEX BINARY 2 4 ? Rick Graziani graziani@cabrillo.edu

  27. What about 8 bits? Dec. Hex. Binary Dec. Hex. Binary 0 0 0000 8 8 1000 1 1 0001 9 9 1001 2 2 0010 10 A 1010 3 3 0011 11 B 1011 4 4 0100 12 C 1100 5 5 0101 13 D 1101 6 6 0110 14 E 1110 7 7 0111 15 F 1111 ----------------------------------------------------- HEX BINARY 2400100100 Rick Graziani graziani@cabrillo.edu

  28. What about 8 bits? Dec. Hex. Binary Dec. Hex. Binary 0 0 0000 8 8 1000 1 1 0001 9 9 1001 2 2 0010 10 A 1010 3 3 0011 11 B 1011 4 4 0100 12 C 1100 5 5 0101 13 D 1101 6 6 0110 14 E 1110 7 7 0111 15 F 1111 ----------------------------------------------------- HEX BINARY 2400100100 Rick Graziani graziani@cabrillo.edu

  29. Using Hex for 8 bits Dec. Hex. Binary Dec. Hex. Binary 0 0 0000 8 8 1000 1 1 0001 9 9 1001 2 2 0010 10 A 1010 3 3 0011 11 B 1011 4 4 0100 12 C 1100 5 5 0101 13 D 1101 6 6 0110 14 E 1110 7 7 0111 15 F 1111 ----------------------------------------------------- Hex BinaryHex BinaryHex Binary 1200010010 3C 99 AB 1A 00 02 B4 7D 0111 0111 1000 1111 1111 1111 0000 0010 1100 1001 0101 1100 Rick Graziani graziani@cabrillo.edu

  30. Using Hex for 8 bits Dec. Hex. Binary Dec. Hex. Binary 0 0 0000 8 8 1000 1 1 0001 9 9 1001 2 2 0010 10 A 1010 3 3 0011 11 B 1011 4 4 0100 12 C 1100 5 5 0101 13 D 1101 6 6 0110 14 E 1110 7 7 0111 15 F 1111 ----------------------------------------------------- Hex BinaryHex BinaryHex Binary 12 0001 0010 3C 0011 1100 99 1001 1001 AB 1010 1011 1A 0001 1010 00 0000 0000 02 0000 0010 B4 1011 0100 7D 0111 1101 77 0111 0111 8F 1000 1111 FF 1111 1111 02 0000 0010 C9 1100 1001 5C 0101 1100 Rick Graziani graziani@cabrillo.edu

  31. So why is Rick torturing us? <tr> <td rowspan="2" bgcolor="#cccc99">&nbsp;</td> <td height="30" bgcolor="#999966"><div id="mainnav"> Hexadecimal Number Rick Graziani graziani@cabrillo.edu

  32. How much REDGREENBLUE ? <td rowspan="2" bgcolor="#cccc99">&nbsp;</td> RedGreenBlue cccc99 <td height="30"bgcolor="#999966"><divid…> RedGreenBlue 999966 Rick Graziani graziani@cabrillo.edu

  33. Hexadecimal # REDGREENBLUE <td rowspan="2" bgcolor="#cccc99">&nbsp;</td> RedGreenBlue cccc99 Convert to Binary RedGreenBlue Hex cccc99 Bin1100 11001100 1100 1001 1001 24 bits represent a single color Rick Graziani graziani@cabrillo.edu

  34. RedGreenBlue Hex cccc99 Bin1100 11001100 1100 1001 1001 24 bits represent a single color Rick Graziani graziani@cabrillo.edu

  35. RedGreenBlue Hex 00->FF 00->FF00->FF Bin0000 00000000 0000 0000 0000 thruthru thru 1111 11111111 1111 1111 1111 Dec0 -> 2550 -> 255 0 -> 255 255 255 255 ? ? ? 0 0 0 Rick Graziani graziani@cabrillo.edu

  36. 255 How Much? 0 to 255 ? 0 255 ? 0 255 ? 0 Rick Graziani graziani@cabrillo.edu

  37. RedGreenBlue Hex cccc99 Bin1100 11001100 1100 1001 1001 Hexadecimal Decimal16’s1’s c c or 12 12 (12x16) (12x1) 204 = 192 + 12 Rick Graziani graziani@cabrillo.edu

  38. RedGreenBlue Hex cccc99 Bin1100 11001100 1100 1001 1001 Hexadecimal Decimal16’s1’s c c or 12 12 (12x16) (12x1) 204 = 192 + 12 Rick Graziani graziani@cabrillo.edu

  39. RedGreenBlue Hex cccc99 Bin1100 11001100 1100 1001 1001 Hexadecimal Decimal16’s1’s 9 9 or 9 9 (9x16) (9x1) 153 = 144 + 9 Rick Graziani graziani@cabrillo.edu

  40. RedGreenBlue Hex cccc99 Bin1100 11001100 1100 1001 1001 Dec 204204153 Rick Graziani graziani@cabrillo.edu

  41. 255 204 0 255 204 0 255 153 0 Rick Graziani graziani@cabrillo.edu

  42. <td rowspan="2" bgcolor="#cccc99">&nbsp;</td> Rick Graziani graziani@cabrillo.edu

  43. www.december.com • For those of you interested in Web Design and Digital Media, you will work with colors based on hexadecimal code, hue, other codes, or shades. • http://www.december.com/html/spec/color.html Rick Graziani graziani@cabrillo.edu

  44. Chili Powder #C73F17 C 73 F1 7 16’s1’s16’s1’s16’s1’s 12 7 3 15 1 7 12x16 7x1 3x16 15x1 1x16 7x1 192 + 7 48 + 15 16 + 7 1996323 Rick Graziani graziani@cabrillo.edu

  45. Chili Powder #C73F17 C73F17 1996323 Rick Graziani graziani@cabrillo.edu

  46. Try these E E8 26 2 F F8 C6 9 A 78 D8 4 Rick Graziani graziani@cabrillo.edu

  47. Try these E E8 26 2 1110 11101000 00100110 0010 23813098 F F8 C6 9 1111 11111000 11000110 1001 255140105 A 78 D8 4 1010 01111000 11011000 0100 167141132 Rick Graziani graziani@cabrillo.edu

  48. Color Codes Rick Graziani graziani@cabrillo.edu

  49. Hexadecimal Number System CS 1 Rick Graziani Cabrillo College Spring 2007

More Related