Special offer

Cool Tools: Hex Color Code Chart & Generator

By
Industry Observer

If you spend any time playing with blog or website design, you may have the need to find the color HEX CODE to match a particular color in a design scheme ....

This little tool located here: http://www.2createawebsite.com/build/hex-colors.html  can make the job quick and painless.

Here's how to use it.

First drag the slider under "hue" until it is in the general color range you need. 

 

Then double click in the large box under "Brightness/Saturation".  Begin dragging the cursor around inside the box.  Upward and towards the left for lighter, downward and towards the right for darker.  As you do this, watch the box labeled "Swatch". 

 

When the color displayed in "Swatch" is the color you want, stop.  Look down at the box labeled "Hex".  There's your six digit Hex code for the color to copy and paste into the html of your website or blog.  You also have the RGB code. 

Yes, I know, the Photoshop color picker works the same way, but it is handy to have the tool on line as well.

 

If you want to have a little more fun, copy the Hex code (without the hash mark #) into the "Choose a Color Scheme" tool and click Update.  The tool will generate a few suggested omplimentary colors. 

 

 

 

Posted by

 

Cheryl Johnson

 



 

 

Frank Schulte-Ladbeck
Frank Schulte-Ladbeck Professional Real Estate Inspections - Houston, TX
Thanks for the tip. I have been playing with the colors on my other blog, but I am now looking at updating my website. This looks like a great tool to use it.
Jan 30, 2008 12:05 AM
Tom Braatz Waukesha County Real Estate 262-377-1459
Coldwell Banker - Oconomowoc, WI
Waukesha County Realtor Real Estate agent. SOLD!

Cheryl

I must admit I have a time just keeping up with things.

Tom Braatz

Jan 30, 2008 12:08 AM
Ted Baker
Carmody and Associates LLC - Winter Haven, FL
MidFloridaMediation.com
Thanks, Cheryl - The 2createawebsite.com link you provided contains a number of other useful bits of info as well.  As I say frequently about your posts - I may learn somthing here, if I am not careful.
Jan 30, 2008 10:06 PM
Ryan Martin
Pacific Continental Realty, LLC - Bellingham, WA
Bellingham Commercial RE Broker

Cheryl - Nice color wheel. I came across another good html color program the other day. I will try to find the link. It actually put together schemes of 6 colors. 

UPDATE: here is the link

Feb 19, 2008 11:53 AM
Anonymous
nathan m

what is the code so I can put that generator on my website

Jul 10, 2008 03:32 PM
#5
Anonymous
Michelle p

Well What is The Code So I Can Put That Html Colour On my Piczo Help Site XD x.           Thankyou

Jul 31, 2008 08:42 PM
#6
Cheryl Johnson
Highland Park, CA

Michelle -- I haven't tried Piczo.  Looks like Piczo tries to do so much for you that sometimes simple changes get complicated.  :-)

I can see how to set a background color for the entire page---

Click the Background icon

Click the color tab on the far left

Click "Advanced Feature: Enter HTML Code:"

Then type the hex code number in the box right after the words "Enter HTML code"

If you create a text box, I see little boxes down at the bottom of the text entry window to click for Text Color and Background Color.  Click on HTML, and a Script Prompt window pops up.  Type the hex code in the little script box.

 

Jul 31, 2008 10:57 PM
Anonymous
graphic design los angeles

This one will help me out a bunch. Thanks for this post.

 

kimberly ventura

http://www.clearmediawebdesign.com

Dec 28, 2008 02:16 PM
#8