Choosing Colors for the Web

Choosing Colors for the Web

05 October 2011

Choosing Colors for the Web

Whether you're working with a designer or developer, or building your own site, you will have better results selecting colors if you use a consistent benchmark for colors. Web designers and developers often talk color to each other in HEX. These are the hexadecimal screen values for colors. Here's how Wikipedia defines it:

Web colors have an unambiguous colorimetric definition, sRGB, which relates the chromaticities of a particular phosphor set, a given transfer curve, adaptive whitepoint, and viewing conditions.

This won't guarantee 100% perfect color consistency from monitor to monitor (every screen sees color just a bit differently), but it will get you a lot closer to a universal color. If you need more control, you'll want to switch to using images and color management, but the use of hex colors increases the likelihood that your website colors will be seen the way you want them to be seen.

So how do you find these Fabulous hexadecimal color values?

Here are some links to my current favorite sites:

  • Color Scheme Designer
  • Canva (Search for a descriptive color name or select a color square right from the page. Each color square contains a link to more info, then follow again for some tasty color combinations. More goodies on this site for inspiration and design assets too.)
  • WorkWithColor (Doughnut Color Picker, excellent info on color principles and how they apply to web.)
  • ColorPicker (Put together several colors to see them together.)
  • Colors On The Web Colorwizard (Fun interface, easy to use. Put together several colors to see them together.)

Any one of these sites will give you HEX values for your selected numbers. Just look for the boxes that identify themselves as such. They're easy to spot once you know what they are.

Julia's Tip

My suggestion is to avoid highly intense or dark colors for your page area. Your page background color or picture tile will definitely affect the rendered color of your text.

Take note that light text over a dark color is more difficult to see and can be fatiguing for the eyes, especially on hand-held devices (though it can be successful if handled with care).

If you don't have enough contrast between the two colors, your text will be difficult to see even on the best of monitors or device screens.

Happy Coloring!

Julia O'Reilly

Stay In Touch

If you're on Facebook, check out my Art and the Studio group for conversations and dialog about the making of art.

Hey, Artists!

Would you like to create real income from sharing what you know while traveling to places you want to experience? Check out the Golden Dragonfly Traveling Academy for Art. It’s a special kind of place where you can create and sell your own workshops or retreats.

Grow your audience, see the world! For artists and art lovers who love to travel

If you'd like to stay informed about workshops, retreats, sales and shows, the best place is my art newsletter

I don't flood your inbox, but I will keep you informed. I never sell or share your email address or any other contact information with anyone else, and you can unsubscribe at any time.