Color Scheme for Web

Virginia Uncategorized

If you haven’t already done so, deciding you color scheme for branding is important when planning your web design. When I work with clients to develop a color scheme or style guide, I always consider the logo. The logo will be on every page and should be the inspiration for the style guide.

Color has an incredible ability to emit emotions or create an essence. Colors play an influential role in purchases and branding. How we interpret color is personal based on preferences, experiences, culture, etc. Although many studies have been conducted to understand the impact of color or customers’ perception of a brand personality based on color, there is ranging views.  The recommendation is to choose brand color to support your personality instead of trying to fit into the color associations.

emotion guide


Here are some article about color theory and the meanings of colors that may help you pick your color scheme for the web.

Color Wheel Pro


Color Matters

You should also consider your target audience when choosing colors. Your audience’s gender, age or culture can help you filter down the color scheme. More importantly, what is your business about? What emotions do you associate with your products or services?

I recommend a minimum of three colors in your color scheme. This does not include black, white or grey. You need a background, base and accent color. You should also understand the basic techniques for combining colors. Studio Press offers a great article on color design that shows examples of color combinations.

Let’s take my logo and website as an example.

Mystical Marketing Color Scheme

mm colors

Accent Color
This color was derived from my logo. I use it as an accent font because it is bold, high contrast to base and background font. It is used for my buttons, icons, graphics to give them high impact.

Base Color
Using the Adobe Color Wheel, I entered the value of my accent color. I selected the triad color combination and liked the blue hues. The darker blue is used for my headlines. It’s rich tone is perfect for drawing the eye and setting the tone and feel of my website.

Background Color
I chose the softer blue for hyperlinks. It’s contrast was distinguishable enough to see it against the grey body text. Also, the days of adding color background to websites is gone, as majority of sites have a white background. That is because people like clean designs and white space.

color wheelUse the Adobe Color Wheel to get color combinations. If the colors in the combination rules are not what you are looking for, take your mouse and move the color arrows. You can do that on the wheel itself, or using the sliders below. Once you have selected your colors, write them down – both the RGG values and the HEX. Both will come in handy in the future.

No matter what you choose, make sure you are happy with it. Once you begin to incorporate your color scheme into your brand, it can be costly and time consuming to change it.

Need help picking your color scheme? Contact us now for additional support.