Designing With the Color Green

Article by Wellington Almeida in Design, Resources, Tips, Web Design | 9 comments

Color in design affects different people in different ways and it is very important when designing with the purpose of conveying a message. The study of color is extremely important as something as simple as slightly changing the hue or saturation of a color can completely alter the atmosphere. Green, a cool secondary color, are often more subdued than warm colors such as bright red or orange. It is a calm and relaxing color that is commonly associated with nature – it takes some attributes of yellow that can either elicit a sense of fun or conservative professionalism.

Green, commonly associated with nature and environmentalism, is actually a very neutral color. As many things in nature are green, the color can represent growth, development and opportunity. Themes of renewal and abundance are also commonly associated with this cover. However, one must be careful when choosing to design with the color green, as it can also represent envy or jealousy, hence the expression “green with envy”.

Like blue, green is a very calming color, however as mentioned above it brings forwards a sense of vibrancy and dynamic energy of yellow. This mixture of blue and yellow in the context of design can have a harmonizing effect and because it is such a neutral color, this balance brings stability and safeness in design choices.

As with other colors, greens come in many hues. Brighter greens are usually more energizing, vibrant and fun. blnk.com is an excellent example of this:

Contrastingly, more subdued greens are less vibrant but as a result, are more stable and representative of affluence. Websites such as mint.com and clearleft.com use lighter more subdued greens that are less colorful, but more professional:

Olive-toned greens express more natural feelings and representative of the natural world. Environmental-activism related sites often use this color scheme along with natural elements in the graphics to create a very down-to-earth message. An example of this is plantwithpurpose.com

However, designing for environmental groups are not only limited to olive greens. The website for Hong Kong Youth Environmental Awareness uses brighter greens to convey a more youthful message whilst maintaining ideas of conservatism and sustainability:

Another example of green in web design is emotionslive.co.uk, a personal portfolio. I particularly like this design for its widespread use of green and light/shading:

Green does not have to be the dominant color of the design. For example, you can pick out particular elements in a web design to accentuate with a vibrant green. In the header of ligonier.org, the designers used a natural bright green to emphasize its main content:

Personally, I think the color green is very appropriate for designs related to wealth, stability, renewal, and nature. Brighter greens are more energizing and vibrant, while olive greens are more representative of the natural world. Dark greens are the most stable and representative of affluence. Regardless of your choice of color scheme, it is important to remember that a slight change in hue or shade can completely change the message you are trying to deliver and that significance color theory should never be overlooked.