Hex Color Codes

Channels >> Webmasters >> Hex Color Codes
Hex Color Codes
Posted by Tiff (#1) on 25 June 2012, 9:54 PM EDT in Website Resources
In general, if you want to change colors of things such as text or backgrounds or borders or whatever using HTML, you use hex colors codes. Since oftentimes trying to find or think up the right hex code for the color you want is pretty inconvenient, we've added a hex code selector here on PokeDS for you to use.

Hex Color Selector



Web Safe Colors


In a long gone era of the internet and computing, computers were only able to view up to 256 different colors. To make it easier for webmasters to make sure the colors they used were properly preserved regardless of this limitation, a list of 216 web safe colors was made to be used as a standard. While using web safe colors really isn't necessary at all for today's computers, the web safe palette is still a very convenient one and thus I went ahead and made an interactive web safe color chart here.

Click on any of the colors to see its hex code to the right.



Hex Codes Explained


Although hex codes are the standard way to add colors to HTML on the internet, many internet goers and HTML coders find themselves using hex codes without ever really needing to understand how to read the code. And in general, while it's not too hard to just look up color codes when you need to, hex codes are really quite simple.

Hex codes are in the format of a pound sign ('#') followed by six characters that range from 0-9 and A-F. The 'hex' in hex codes is short for hexadecimal. Although you don't always have to type the '#' in front of a hex code while entering colors, the pound sign is used to tell the computer that you are talking in hexadecimal numbers.

Basically, with hexadecimal number system, bases of 16 are used instead of bases of 10. The letters in the numbers are used to represent single digits that are higher than 9. Therefore:
  • A represents 10
  • B represents 11
  • C represents 12
  • D represents 13
  • E represents 14
  • F represents 15

In the hexadecimal system, 255 is a similar number to what 99 is in the decimal system. The decimal number 255 is represented by the hexadecimal number FF. To understand the conversion from hexadecimal to decimal see that:
  • FF = F * 16 + F = 15 * 16 + 15 = 255
  • DD = D * 16 + D = 13 * 16 + 13 = 221
  • FD = F * 16 + D = 15 * 16 + 13 = 253
  • DF = D * 16 + F = 13 * 16 + 16 = 223
Note that in the examples above, the first digit is multiplied by 16 each time. This is similar to how we normally multiply digits by 10 for each place value the digit has. For comparison:
  • 255 = 2 * 10 * 10 + 50 * 10 + 5 = 255
  • 221 = 2 * 10 * 10 + 2 * 10 + 1 = 221
  • 253 = 2 * 10 * 10 + 5 * 10 + 3 = 253
  • 223 = 2 * 10 * 10 + 2 * 10 + 3 = 223

When a computer is reading a hex color code, it's basically looking at a string of three numbers. The first two digits represent the amount of red in the color, the second two digits represent the amount of green in the color, and the last two digits represent the amount of blue in the color.

Take the hex code #FF00EE for example. You get:
  • FF or 255 red
  • 00 or 0 green
  • EE or 238 blue

In general, colors with higher total values (closer to FF) of red, green, and blue will be lighter and colors with lower values (closer to 00) will be darker. For reference, #FFFFFF (all 255) is the hex code for white while #000000 (all 0) is the hex code for black. Remember that RGB colors mix like light, where white is the presence of all colors unlike paint mixing where mixing all the colors together gets black.
Navigation
© 2017 PokeDS. Pokémon © 1995-2017 Nintendo/ Pokémon. Icons © LED24.
Page generated in 0.0633 seconds.
AboutContactLinkTermsPrivacyHelp
Silver Islands Indigo Plateau The Cave of Dragonflies Clash at the Summit