How Is the Color Wheel Used in Animation and UX Design?

Name: Levende Streg ApS
Address: Flæsketorvet 68, København, Sjælland, 1711
Telephone: +45 2818 8586
Price range: $ - $$$$$

In animation and UX design, the color wheel is used to ensure good readability, clear contrast, and intuitive user experiences that align with a brand’s visual identity.

THE COLOR WHEEL – LEARN ABOUT THE COLORS

Would you buy a car without considering the color?

The color wheel and colors – isn’t it just for kids? No, colors are an essential part of our everyday lives. Did you know that we draw conclusions about color in 1/20th of a second (Paris Sherin: Design Elements: Color Fundamentals). Colors aren’t just nice to look at. They have a profoundly functional effect. Therefore, you should also know how to put together and use colors to your advantage in your business communication.

The Color wheel

What is a color wheel?
A color wheel (also called a color circle) is a valuable tool when you’re choosing colors for a project. Let’s take a closer look at what a color wheel is and how you can use it.

Did you know that people form an impression of color in as little as 1/20 of a second (Paris Sherin, Design Elements: Color Fundamentals)? And colors aren’t just nice to look at—they serve a very real, functional purpose. That’s why it’s important to understand how to combine and use colors to your advantage in business communication.

Itten’s Colors wheel

A fundamental tool

Itten’s color wheel is a fundamental tool for professionals working with visual communication, animation, design elements, graphics, illustration, basic color theory, and UX design.

The color wheel enables informed decisions about color choices, combinations, and harmonies, resulting in visually appealing and effective designs that communicate the intended message and evoke the desired emotions in the audience.

What is Itten’s Color Wheel?

Itten’s color wheel, also known as Johannes Itten’s color wheel, is a fundamental concept in visual communication and graphic design. He is widely regarded as one of the great masters of color.

Johannes Itten, a Swiss Expressionist painter, artist, and educator, developed this color wheel as part of his work at the Bauhaus school of design in the early 20th century. He is considered one of the foremost authorities on color.

How to Use Itten’s Color Wheel

Itten’s color wheel is simple and easy to understand and use. It is structured around the three primary colors at the center (yellow, red, and blue). Next come the secondary colors, which are created by mixing the primary colors (yellow + red = orange, red + blue = purple, and yellow + blue = green).

Around the wheel, you’ll also find the tertiary colors. Complementary colors are identified by drawing a straight line from one color to the opposite side of the wheel. For example, the color opposite orange is blue, making them complementary colors.

Colors, Emotions, and CVI

How do we use the color wheel in everyday work?
Colors are a key part of a company’s CVI (Corporate Visual Identity), but what is a CVI exactly? A CVI is a comprehensive set of visual elements—including logos, color schemes, typography, and design guidelines—that together represent a company’s brand identity.

Colors play a crucial role in a CVI because they evoke specific emotions, communicate the brand’s personality, and increase brand recognition. Consistent color choices across all brand materials help create a cohesive and memorable visual identity.

For example, a bank may use conservative blue or green color palettes to communicate trust, stability, and reliability, while a technology company might choose bold and innovative colors such as red, orange, or yellow to express creativity and innovation. The right color palette strengthens brand messaging, creates a lasting impression on customers, and makes a brand instantly recognizable in a competitive market.

A strong Corporate Visual Identity (CVI) ensures that all visual communication—from marketing materials to digital assets—aligns with the company’s values, message, and goals. This consistency helps build a clear, memorable, and impactful brand presence in the marketplace.

Cool and warm colors

In the color wheel, colors centered around yellow and orange are considered “warm colors,” while colors centered around blue are classified as “cool colors.”

Visually, cool colors tend to recede into the background, whereas warm colors appear to move forward in an image. This effect is widely used in design and visual communication to create depth, focus, and visual hierarchy.

Tips from our book

We have written a book titled “Visual Communication – Can You See What I Mean?” published by Hans Reitzel. The book is used as a textbook in visual communication programs at the Copenhagen School of Design and Technology (KEA), the University of Copenhagen, and the Danish School of Media and Journalism (DMJX).

Here are a few tips from the book.

If you’re interested in learning more about color—such as how to create effective color themes or work with accent colors—you’ll find much more in the book.

Blue and Red Chromostereopsis

Did you know that red and blue can be difficult to combine in a color theme? When a designer tells you that the red you’ve chosen doesn’t work well with the blue or green in your color theme, there’s a good reason for it—and it’s clearly demonstrated by this visual effect.

The issue is caused by the way different color wavelengths converge in the human eye. Some colors are processed sooner than others, making it hard for the eye to distinguish what appears in front and what falls into the background. As a rule, cool blue tones tend to recede visually, while warm red tones appear to move forward.

However, with certain highly saturated (“intense”) reds and blues, the colors can visually clash and blur together, causing eye strain and discomfort. The same effect can also occur when combining red and green. For this reason, it’s often a good idea to use professional tools—such as Adobe’s free color wheel and color theme generators—to test and refine your color theme before finalizing it.

Accentuated colors LIVE

How do we use colors when drawing live? Colors evoke specific emotions in an audience due to the psychological and cultural associations we have with different shades. We actively use this knowledge when creating strategy visualizations, live drawings, and animated films.

For example, warm colors such as red and orange often trigger feelings of excitement, energy, and passion, making them ideal for brands that want to create a sense of urgency or enthusiasm. In contrast, cool colors like blue and green tend to communicate calm, trust, and reliability, which makes them well suited for companies aiming for a more stable and trustworthy brand image.

By strategically choosing colors in branding and design, businesses can influence how audiences feel about their products or services, creating stronger emotional connections.

When drawing live (or visualising strategy live) all color choices are aligned with the client’s visual identity. We also use accent colors to highlight key elements and guide the viewer’s attention, ensuring that the most important messages stand out clearly.

Color themes

Almost all color themes are based on the classic color wheel with its 12 color segments.

Adobe’s platform, for example, offers an excellent tool for creating color themes: https://color.adobe.com/da/create/color-wheel/. Below, we’ll take a look at the four most commonly used ways to create color themes.

Monochromatic color theme

A monochromatic color theme is based on a single color from the color wheel and is built using different tones and shades of that one color. This type of color theme is a safe choice, but it can often appear visually dull.

Analogue color theme

It’s the second most simple theme to create. Again, you should start with the color wheel. And here you simply choose three colors that are next to each other in the wheel.

Traditionally, the colors in your theme should be of the same “purity”, color harmony or “chroma level”. But at the same time, you can also add colors made from shades and tints to make the theme more interesting to look at.

Complementary color theme

Complementary color themes are created by selecting a primary color from the color wheel – and then adding the color that “faces” it on the opposite side in the color wheel (such as orange and light blue).

Here you see e.g. Hulk’s easily recognizable color theme (from Marvel’s Hulk comic book). However, I would recommend that you do not choose red and green (both for the sake of color blindness, lack of contrast and Christmas peace in general).

If you want to make a simple color theme according to this pattern, you can just combine eg. two colors – and then expand with tints and shades.

Triadic color theme

Here, 3 colors are used, as the model’s name suggests. Imagine putting a “Mercedes logo” on top of your color wheel. That way you get three colors that are evenly distributed on the color wheel.

These types of themes may well be difficult to get nice and cohesive. But it does, on the other hand, provide an “exciting” and quite complex color theme.

Animation and Color

How do we use the color wheel when creating animated films? When producing animations or illustrations, it’s essential to understand color theory and Itten’s color wheel. This knowledge helps in choosing colors that capture attention, convey meaning, and create a cohesive visual experience.

Colors evoke emotions and reactions in the viewer. By using the color wheel, we can select the right color combinations that align with the message or mood a brand wants to communicate through its visual content.

Color Contrast

Itten’s color wheel also explains the concept of color contrast. It highlights the contrast between warm colors (red, orange, yellow) and cool colors (blue, green, purple), enabling designers to make informed contrast choices that improve readability and visual impact.

At the same time, warm colors tend to appear closer to the viewer, while cool colors visually recede into the background.

Color Harmonies

Itten’s color wheel helps create color harmonies by identifying different color schemes such as complementary, analog, triadic, and split-complementary. These schemes are essential for creating visually pleasing and balanced designs. By using color harmonies, designers can evoke specific emotions and moods.

Additional Benefits of the Color Wheel

Mixing colors

Itten’s color wheel provides a foundation for understanding color mixing. It illustrates how new colors are created by combining the primary colors (red, blue, and yellow) and their various combinations.

This knowledge is essential for both traditional and digital design, as it helps designers select and mix colors accurately.

Color Psychology

Itten’s color wheel is a valuable tool for understanding color psychology.

Different colors evoke different emotions and reactions in the viewer. By using the color wheel, designers can choose colors that align with the message or mood they want to communicate through visual design.

UX Design

In user experience (UX) design, color plays a critical role in creating intuitive and visually appealing interfaces.

Itten’s color wheel helps UX designers select color schemes that improve usability, interaction, and readability. It ensures that color choices align with both the brand’s identity and user expectations.

Take the First Step Toward Better Communication

Visual communication as a strategic communication tool can transform the way you convey your message.

Maria Prohazka

Creative Rockstar
(+45) 2818 8586
mp@levendestreg.dk

Marie Buus

Managing Partner
(+45) 2658 7434
mb@levendestreg.dk

FAQ

What Is a Color Wheel?
A color wheel (also known as a color wheel or color circle) is a tool that shows the relationships between colors. It is used to create harmonious color combinations in design, branding, graphics, illustration, and visual communication.
What Is the Color Wheel Used For?
The color wheel is used to select color combinations, identify complementary colors, create contrast, build color harmonies, and make intentional color choices across all types of visual projects and visual communication (such as logos, CVI, animation, and UX design).
Why Are Colors Important in Branding and Communication?
Colors influence emotions, recognition, and decision-making.

People form impressions of color in fractions of a second, and the right color choices strengthen a brand’s message, credibility, and visibility.
What Is Itten’s Color Wheel?
Itten’s color wheel is a classic color model developed by Johannes Itten. It is widely used in graphic design, animation, illustration, and UX design to create harmonious and functional color combinations.
How Is Itten’s Color Wheel Structured?
The color wheel consists of primary colors (yellow, red, blue), secondary colors (orange, green, purple), and tertiary colors. Complementary colors sit opposite each other on the wheel and create strong contrast.
What Are Warm and Cool Colors?
Warm colors such as red, orange, and yellow are perceived as energetic and attention-grabbing, while cool colors like blue and green feel calm and tend to visually recede in a design.
What Are Complementary Colors?
Complementary colors are colors that sit directly opposite each other on the color wheel, such as blue and orange. They are used to create strong contrast and visual emphasis.
What Is Color Psychology?
Color psychology focuses on how colors influence human emotions and behavior.

Colors can signal trust, energy, calmness, or creativity and are used strategically in branding and design.
What Is a CVI (Corporate Visual Identity)?
A CVI is a company’s overall visual identity, including its logo, colors, typography, and design guidelines.

Colors are a core part of a CVI because they strengthen brand recognition and visual consistency.
How Are Colors Used in Live Drawing and Visualization?
Colors are used to highlight key elements, create visual hierarchy, and guide the viewer’s attention in live drawing, strategy visualizations, and illustrations.
What Is a Color Theme?
A color theme is a planned combination of colors based on the color wheel. The most commonly used color themes are monochromatic, analog, complementary, and triadic.
How Is the Color Wheel Used in Animation and UX Design?
In animation and UX design, the color wheel is used to ensure good readability, clear contrast, and intuitive user experiences that align with a brand’s visual identity.

Creativity that hits right in the heart

GIVE US A CALL

+45 2818 8586

Levende Streg ApS
CVR: 35417168
Rahbeks Alle 21,
1801 Frederiksberg C

WRITE US

mb@levendesteg.dk

Facebook
Instagram
LinkedIn
YouTube
Vimeo