The SharePoint Designer

Brand. Design. Amaze.

Dec 1

Colours and Combinations

No Gravatar

I spent most of last night playing with Adobe PhotoShop CS, playing with colour combinations. I have a few ideas in my head, which I have to put to canvas for a friends SharePoint 2010 site, and her base colours are yellow and orange. The combination is awesome, but you cannot flood a site with two strong colours. It is an eye sore, so you bring in whites, greys, and opposite colours to off set the design.

When choosing your colour chart you always need to look at the company logo, or for internal sites – have a chat to the main users. If a user is going to be on that site 10 – 20 times a day, you don’t want them to have a head ache because of ‘color over drive’.

You also want to use colours to ‘control’ the mood and emotions of the person viewing it.

Web Colour Meanings and Emotions

So lets look at the meaning of colours in web design: I took this information from New1 Web Design’s website ( you can follow them on twitter at @new1_web_design )

Warm Colors

Red: Red is one of the most powerful and attention-getting colors. Red symbolizes passion and fire, love and lust. It has been proven to raise blood pressure and cause perspiration. Red reflects energy and can motivate an individual to take action. It can also symbolize war, violence, blood, and aggression.

Pink, however, is the softer side of red. Pink is romantic, calming and feminine.

Orange: Vibrant and warm, orange is associated with autumn, pumpkins and Halloween. It inherits many of the traits of red, but is less passionate. Orange has been known to stimulate the appetite. As a citrus color, it can also symbolize health.

Yellow: Yellow symbolizes sunshine and warmth. It can mean hope, light and energy. On the other hand, it can mean weakness or illness, or symbolize cowardice.

Cool Colors

Green: Green signifies health and growth (vegetation) and wealth (money). Green symbolizes spring, renewal, and fertility. It can also mean jealousy or inexperience.

Blue: Blue is one of the most calming colors and is associated with the sky and the sea. It is considered to be a “safe” color and signifies intelligence, reassurance, and trust. Blue has also been known to be an appetite suppressant and can signify depression and sadness.

Purple: The combination of red and blue, purple is one of the most intriguing colors and symbolizes creativity. Purple is spiritual and mysterious. Deep purple is associated with royalty and richness while
lavender is associated with romance and nostalgia.

Neutral Colors

Black: Black can represent power, elegance, and sophistication, but it can also represent death (Western culture), evil, anger and sadness.

White: White represents cleanliness, purity, and spirituality. It represents life and marriage in Western cultures, but it represents death in Eastern cultures.

Grey: Grey is the combination of black and white. It is a conservative color. Grey can symbolize security, maturity and reliability, but it can also signify gloominess and sadness.

Brown: We like to classify brown as a “special” color. Sometimes brown can be used as a neutral and sometimes as a warm color. Either way, brown represents credibility and stability, the hearth, home and the earth.

The meaning of colours in Business have similar means, the following is take from Susanna Hess’s Blog

Business Colours and Emotions

White is associated with light, goodness, innocence, and purity. It’s seen as clean and safe.

Black is associated with power, elegance, formality, death and mystery. It signifies strength and authority.

Brown is associated with earth, order, stability and convention. It gives a solid and wholesome feeling.

Red is associated with energy, strength, power, danger, action, determination, confidence, passion, courage, desire and love. (It can often cause physical reactions like raised heart rate, and breathing.)

Blue is associated with trust, loyalty, wisdom, intelligence, expertise, confidence, stability and depth. (Unlike red, it has a calming effect and slows the breathing and heart rate.)

Green is associated with stability, endurance, healing, harmony, safety, and well being. It can stir up thoughts and feelings of financial wealth.

Yellow is associated with intellectual energy, wisdom, happiness, and joy. It stimulates mental activity, and brings up pleasant feelings, and cheerfulness.

Orange is associated with creativity, attraction, success, determination, enthusiasm, happiness, joy, fascination, the tropics, stimulation and strength. It evokes thoughts of harvest and fall.

Purple is associated with dignity, mystery, magic, independence, wisdom, and creativity. It conveys extravagance and wealth.

So we know what emotions will be brought to the surface if we use these colours. But how about colour ranges, and opposite colours?

Colour Combinations and Mixing

There are so many great websites that can help you plan your colour scheme. Here are my favorites:

Adobe Kuler: This is a very mathematically brilliant site to use, it allows you full control of your colours, but doesn’t allow you to “destroy” your scheme with a terrible match. I use this one the most :) It provides a brilliant, quick way of settling your “colour range” argument. I call it an argument, because if you have ever met a graphics designer with a touchy client, you understand.

Color Scheme Designer Another fantastic site, and I actually put this and Kuler up against each other to see if the colours match up. I enjoy this one because of its’ ease of use and the way the wheel works and the way you can choose a colour scheme type.

Color Schemer: If you are struggling you can grab some fantastic inspiration from this site, and even up load your own colour schemes to help others.

Once you are done, you can always use Check My Colours to get a very good “drill down” of where your sites colours have missed the mark slightly.

So, remember, a site is not all functionality and code. It is also about presentation and feel. If you ever need help, just call three people in your office to look at your design or colour chart. Listen to their opinions and work from there. You cannot please every one, so please yourself and the person paying.

Tags: ,

7 Comments

  1. provillusNo Gravatar

    December 5, 2010

    Reply

    One of my goals in life is to learn as much as I can and this blog definitely teached me some things.

  2. pierścionkiNo Gravatar

    December 8, 2010

    Reply

    Great article I’ve just added to my bookmark list.

  3. living room decoratingNo Gravatar

    December 8, 2010

    Reply

    I appreciate that you put excellent content out that is clear and well-written.

  4. materaceNo Gravatar

    December 8, 2010

    Reply

    That is nice to definitely find a site where the blogger knows what they are talking about.

  5. physical therapyNo Gravatar

    December 9, 2010

    Reply

    Thank you, I have recently been searching for information about this topic for ages and yours is the best I have discovered so far.

  6. Damion PaoliNo Gravatar

    May 17, 2012

    Reply

    Wow, fantastic blog layout! How long have you been blogging for? you made blogging look easy. The overall look of your site is magnificent, as well as the content!

Leave a comment

The SharePoint Designer is using WP-Gravatar