We help IT Professionals succeed at work.

Colors to complement these

Eddie Shipman
on
We have the colors below in our logo and I need some complementary colors to redesign our site.
 Color Palette
Currently we have these values:
#C8DBEA (content background with white content blocks)
#F9F9F9 (main body background)

We also have a couple of PNGs with transparent alpha channels from #EFEFEF to #FFFFFF that "float" over the #C8DBEA color to create a darker light-blue.
We have gradient buttons with values #DFDFDF to #FBFBFB
Several elements are #494949
Text color is #666666 and #000000

Oh, and an ugly gradient background in the header:
 Header BG
Comment
Watch Question

CERTIFIED EXPERT

Commented:
Hi Eddie

My view of colour schemes/themes in websites is that they need to reflect the intended purpose of the site.  If selling a product, the colours need to complement the nature of the product or establish a mood that you want the viewer to feel when visiting.

For example, selling some kind of "organic" product like a herbal health supplement woulod generally work best with colours that conjure up the feeling of "earthiness" or closeness to nature, but selling a malware removal software application might call for more "jangly" colour combinations that alert a viewer about danger.

Colours are a highly subjective issue, and where some colour combinations might blend perfectly in one viewer's eyes, they may clash in another's.  There are obviously some general rules about how certain frequencies of light (colour) are perceived by our brains and can change moods, and there is a well known wheel of colour (http://colorschemedesigner.com/previous/colorscheme2/index-en.html) that allows you to pick but complementary shades of colour, but it's too mathematical in my opinion.

Would it be possible to let us see the current website so we have an idea what the intended use of the site is, where the areas of colour will be, and to allow us to get a general feel for the site?

Bill

Commented:
I used this neat tool online: http://colorschemedesigner.com/ to come up with some colors

 I also used this site where people shared color schemes: this one has some colors you might consider: http://www.colourlovers.com/business/trends/branding/7782/TKAHB

To use some of the tools, I figured out the RGB and hexidecimal values of your pantone colors
Purple: R=89  G=16  B=45 (or hex number 59102d)
Gold: R=240 G=179 B=13 (or hex number f0b30d)
Brown R=208 G=132 B=22 (or hex number d08416)

This tool was easiest to use: http://www.colorsontheweb.com/colorwizard.asp

DeeDee
Eddie ShipmanAll-around developer
CERTIFIED EXPERT

Author

Commented:
Site is http://www.scic.com We are looking at  redoing the color scheme and I am at a loss as to what will work with the logo.

Commented:
I think the blue is just not working with the logo colors. I did a quick comp to show how you could change the page

DeeDee
Colors.png
Eddie ShipmanAll-around developer
CERTIFIED EXPERT

Author

Commented:
I thought about using grayscale, too. But I am not sure how they are going to accept that.

I, personally, prefer a much cleaner solution like sprint.com.

I just started here 6 months ago and was not involved in teh design decisions. I hear that it took the design team several months to come up with the design that they have and they went through many different color schemes. I want to knock their socks off with something that will take their breath away at beauty and usability. I am already working on a lot of the usability issues.

Thanks for the comp.

Commented:
I also tried changing the gray to a more warm gray and the navigation bar in a shade of gold

DeeDee
Colors2.png
Eddie ShipmanAll-around developer
CERTIFIED EXPERT

Author

Commented:
Funny thing is, I can't figure out how to use that damn color wheel to get the combinations I want. I can't use the three colors in my logo as base colors and select complimentary colors from that.

Commented:
I couldn't really get it to work either - I could put in one color and let it find complimentary colors - but I couldn't put in more than one color.

DeeDee

Commented:
I found one that you can put in your 3 colors - it doesn't actually pick a color that goes with all 3 but if you change the base color to any color, you can see complimentary colors for each color:
http://kuler.adobe.com/#
Commented:
Also this page has 10 color pickers - sometimes just looking at other people's palletes will give you ideas, too:
http://webdesignledger.com/tools/10-super-useful-tools-for-choosing-the-right-color-palette

DeeDee

Commented:
Good luck on the project - I hope you do knock their socks off with the improvements you will make!

DeeDee

Explore More ContentExplore courses, solutions, and other research materials related to this topic.