Brown in Website Design

Introduction

When you sit down and begin to plan out the design of your website, what color immediately comes to mind? White? Black? Blue? When it comes down to it, you should always choose a color or color scheme that matches the vibe or aesthetic your website is going for. Today though, as the title suggests, we’re casting the spotlight on the color brown. Usually when people think about website design, brown is one of the colors at the bottom of their list. Brown is difficult to pair colors with and doesn’t fit many themes. However, brown can be associated with warmth, reliability, and comfort in color psychology.

Example/Explanation

#521515, a shade of brown
#521515

Even if your audience doesn’t know color psychology, they’ll still get those feelings (or similar ones) depending on the brown you use. Using myself as an example, when I see #521515, I think of coffee. Because I like coffee, I might be more inclined to linger on the website and check out what it’s about.

6 websites that use brown

TWIGS – Though Twigs uses a more beige-ish color, beige is still a shade of brown. Twigs uses this soft beige to convey simplicity, which is often associated with sustainability which is a big part of their brand.

Green Rebel – Green Rebel is a brand that specializes in selling “real”, mostly vegan food. They use brown in a somewhat similar way to Twigs, trying to use it to sell their food as earthly and healthy, though they also use it to simulate a cutting board in some places on their website.

UPS – UPS uses brown differently from the first two websites. As it’s not an environment-based business, it uses brown for more simple reasons. UPS uses brown because usually when you ship packages, the boxes are brown. It could also be that brown can symbolize the feeling of reliability, as the company wants you to choose it to ship your packages instead of its competitors.

Burger King – Burger King, much like UPS, uses brown on its website to drive home the “homey” feeling. This brown could symbolize the meat they use for their patties, which are supposedly real compared to its competitors.

Sephora – Now, Sephora’s home website has no brown on it. However, I was struggling to find more examples of brown websites that were not blocked for me so we’re going to look at Sephora’s foundations page. Their foundations’ page is brown not because of earth or a homey feeling, but because they’re advertising makeup meant to cover up your flaws. So naturally, since most humans have a variation of brown as their skin tones, they’re using brown to show how diverse their makeup is.