What the Hex????

Colors are published to the internet using special codes called Hex codes.  The reason for this is so a color can be specified, not by color name such as pink or blue, but to include the shade you prefer.  Once you know your hex code(s) for the website and company you're designing, it's easy to coordinate the elements of your website.

The hex code is in the format of a hastag + 6 characters.  For example: #ff3366 is a bright shade of pink.  #000000 is black.

Photo editing software will allow you to choose this very color as well so you can create all of your images, but...they use a different system.  Their codes are in RGB format, two digits for red, two for blue and two for green.  The combination of each of those three shades of Red, Blue and Green will create the color you're needing.  Now, I know I had a heck of a time coordinating my website at first with the images I was creating...way before I knew about hex codes.  My problem was that my editing software defaulted to working in CMYK format instead of RGB. (I'll post another article on this topic later).  Just be sure your software is working in RGB format because that is what the internet runs on.

"How do you create your hex code?", you ask.  Honestly, I have no idea how to manually create and calculate your own color.  With the tools on the internet today, it's very easy to generate your code with the very specific color you're looking for.

Here is a tool online I find very very helpful.  First, to generate your own hex color, change the hue to the general color you want by dragging the bar up and down.  Then, on the big Brightness/Saturation block, drag the circle around to get the color you want.  You can preview the color your building in the color swatch box to the right of that.  Those little numbers constantly changing at the bottom?  That is your code.  They give you the hex code and the RGB codes.

That's not all...take the hex code you created and enter it into the hex code in the next section down (under the color wheel) and click submit.  This will give you a color scheme and the hex codes for each of those colors.  Don't forget, for your editing software, you're going to need those RGB codes for the corresponding colors.  Just take the hex codes from those and plug it into the code generator you were just working in (it works if you type in the hex code and click in the gray area next to it).  It will change the color swatch and give you the codes you need.  Write these codes down and keep them safe.  You may actually use them so often, you'll memorize them.

Hex Color Code Chart and Generator