In a recent blog post we talked about colors impacting the overall impression of your website. Here we will look at using the color green as a dominant color in websites. This color is a secondary color meaning it can be made from other primary colors (yellow and blue), as opposed to a primary color that is not a part of another color at least in the additive model (reflection) that applies to painting (Konstantinovsky 2021). In the subtractive model (from light), that looks at light, green is a primary color, i.e. RGB in TVs (Konstantinovsky 2021). As far as websites, we are dealing with the subtractive model, which comes from light.
What types of sites use Green?
Green is generally used to promote an environmental, natural, or well-being vibe. Industries associated with this color include providers of energy, if they are environmentally friendly, finance for wealth, households, and food, the well-being. This color is for the most part not used in the transportation or apparel industries. It is often not used for healthcare, however, Humana uses it quite extensively. This color is one of the most popular colors used, behind the color blue.
What do different cultures think of Green?
Your culture may give you differing impressions of this color. Website and brand owners need to be aware of these differences, especially those that are engaged in international marketing. In Western cultures it carries a meaning of nature, freshness, spring, environment, wealth and positivity and in a few a sign of patriotism. In the Middle East it means luck and wealth, while in Eastern cultures it connotes youth and new life. Some Eastern cultures, including Indonesia and China, see this color as a sign of infidelity and is also strongly aligned with Islamic culture (Eriksen Translations 2020).
Examples of Websites using Green
Some of the brands using this color include Heineken, which signifies the first beer to come in a green bottle. Another brand is Starbucks, where it which represents the calming effect of drinking coffee. Subway uses this color in combination with yellow to represent health and vitality. Land Rover uses it to make a connection to nature. Both Nvdia and Android, who are tech related use it to represent newness.
What does Green mean on a Website and in a Brand?
The color green is associated with health (well-being and vitality), prosperity (wealth), creativity, decision-making, and the environment (natural and organic products), and the outdoors. It is a good color to use on websites since green, and blue as well, is one of two colors that both men and women list as their favorite colors. Green is a very soothing color and evokes positive feelings and renewal.
Different Shades have different Meanings
Different shades have different meanings, as well as, the accent colors used in combination. For instance, when used with yellow it gives a youthful appearance, whereas deep shades generate a feeling of sophistication. More generally, darker shades are associated with wealth and finance, while more yellow and lighter shades bring feelings of jealously. Olive shades are associated with peace, i.e. the olive branch.
Application on a Website
This color is linked to creativity, clarity of thinking, making decisions, and also means go on a stoplight. It is often used for buy now buttons on websites linked to electronics and in effect gives a permissive feeling. Studies have shown that green buttons outperform the color red that is a lot more impressive. Social groups also use this color, which shows a need for belonging.
Accessibility Concerns
As always, you want to make sure that you have enough contrast to conform to the WCAG 2.1 AA requirements of 7:1 for small text (<18px) and 4.5:1 for large text (>18px). One accessibility concern with green is color blind people, who may have trouble seeing the color or telling this color from red. If you are crafting a green dominant site it is probably best not to use red with it. This way there will not be a problem in viewing your website for people who are color blind.
Links to Websites of Interest
Colors that go with green on your website
Best Websites using Green from Awwards.com
More websites using this color
References Cited
Eriksen Translations. 2020. How Translating Colors Across Cultures Can Help You Make a Positive Impact. https://eriksen.com/marketing/color_culture/
Michelle Konstantinovsky. 2021. Primary Colors Are Red, Yellow and Blue, Right? Well, Not Exactly. https://science.howstuffworks.com/primary-colors.htm. How Stuff Works.
