Menu
color palette header image - Giovanni Vons Webdesign (personal blog)

Color in design: Creating the perfect color palette

Creating a cohesive and harmonious color palette relies on one thing: knowing what colors go well together and compliment each other. Luckily there are many different ways to mix and match colors to end up with the perfect color palette for your project.

The color wheel.

Examples of the primary, secondary and tertiary RGB colors
Color wheels with primary, secondary and tertiary RGB colors.

Primary colors

The color wheel for digital design is a circle with different colored sections used to show the relationship between colors.

The typical RGB color wheel includes the red, green, and blue primary colors. 

Secondary Colors

Secondary colors are colors that are created by mixing two primary colors. 

There are three secondary colors. In RGB (the color spectrum for digital design), the secondary colors are cyan, blue mixed with green, magenta, red mixed with blue and yellow, green mixed with red.

Tertiary colors

When you mix a primary color with a secondary color you get tertiary colors. There are six tertiary colors. In the RGB color wheel these are orange, chartreuse green, spring green, azure, violet and rose.

Use color schemes to create a harmonious color palette.

Color schemes are an important aspect of color theory and can help you create harmonious color palettes. As a designer, it’s up to you to decide what color scheme fits your project best based on intent, strategy and discovery. Let’s break down a few of the main color schemes.

Monochromatic

Monochromatic color palette sourced on the Adobe color wheel

Monochromatic is a perfect color palette to start experimenting, it exists of a single base hue.

In most cases monochromatic is used with multiple shades in the same hue with varying saturation and brightness.

The reason for this is to maintain contrast on the main color shade and create harmony with background colors and accent colors.

Monochromatic color palette example
monochromatic color palette example

Complementary

Complementary color palette on the Adobe color wheel

Complementary color schemes use two hue’s that are directly across from each other on the color wheel.

They provide high contrast while also appearing more bright and vibrant.

Complimentary colors are like visual opposites, they combine very well because of the contrast, but you have to be careful when you use these colors to maintain balance.

Complementary color palette example
Complementary color palette example

Split Complementary

Split complementary color palette on the Adobe color wheel

A split complementary color scheme is a variation of the standard complimentary one. There is one base color but instead of the opposite color in the color wheel, you pick the colors that surround it.

Split complementary color palette example
Split complementary color palette example

Analogous

Analogous color palette on the Adobe color wheel

Analogous color schemes use colors that are all right next to each other on the color wheel. Think of them as color neighbors. 

Pick any color on the color wheel as your main color and look directly at the three colors to the left or right of the main color.

These four colors together create an analogous color palette.

They usually match really well and together they create a serene and comforting design.

Analogous color palette example
Analogous color palette example

Triadic

Triad color palette on the Adobe color wheel

The triadic color scheme is a lot like split complementary except each color is equal distance on the color wheel. It's a way to add vibrance in your design, but there should be focus on one color. In this use case you can apply the 60/30/10 rule.

Triadic color palette example
Triadic color palette example

Tetradic & Square

Square color palette on the Adobe color wheel

Tetradic & square color palettes use four colors creating a rectangle or square shape on the color wheel. 

Think of it as two sets of complementary colors all being used together.

Square color palette example
Square color palette example

Picking a palette with intent.

When creating a color palette, having a concept in mind for it is important. But, what does that mean exactly?

Well, like music, color is a storytelling tool that relies heavily on emotion. Usually it's to evoke a specific, heavy emotional response.

Color is used to communicate and in communication with color, every color is picked for a reason.

However, as digital designers color palettes are mostly designed to create brand recognition and guidance.

So, with that in mind we should always have a goal with our color choices. And the palette we build should support that goal, or at least connect it.

Let’s talk about how we do that. I like starting with prompts, just some keywords that get ideas flowing.

Words, phrases, moods, anything I think would help capture the essence I have in mind.

Some questions you may ask yourself to come up with these specifics:

  • What do I want to achieve with this design?
  • What feeling do I want to stimulate?
  • Do I want to create chaos or ease?
  • Who am I targeting?

Example outcomes:

  • Excitement
  • Energizing
  • Happy
  • Professional
  • Playful
  • Trustworthy
  • Office
  • Business
  • Women
  • Young demo's

Don't worry about the specifics, don't judge what comes out, you can filter it later.

If you had a discovery session with a client, it should already be clear what the goal is. In that case you can fall back on the psychology of color.

If you need inspiration for a color palette you can also research photography, settings, illustrations and other designers. Anything that comes up when you think of the topic at hand.

You can also take a walk in the forest or the city, whatever inspires you.

It’s not about stealing a color palette, but creating one based on the emotional feeling you want to produce.

Closing words.

There are reasons for everything we do, including the color palettes we choose.

They have to fit our personal style but on the other hand it has to amplify the power it can bring to our clients, creating results over time.

Picking color palettes the right way is combining the want of our client, with our style of design and the goal we want to achieve.

This is the case in all things design and so, it also counts for the color palettes we choose. It makes sense right?

Sources and helpful tools.

The Futur color course

Adobe color wheel

Adobe capture

Sign up for blog updates

Be the first to know when a new blog is released.

Thank you! You are now Subscribed to the Vonzie Updates e-mail list!
Oops! Something went wrong while submitting the form.