Skip to content
An AI-driven
UX & UI masterclass
Back to course
Design fundamentals Lesson 10 of 16

Give each color a clear job.

Name the main color groups and explain what each color does in a design.

Sculptural type, sunlight, and pencil marks exploring give each color a clear job.

What you will learn.

Name the traditional primary, secondary, and tertiary groups and give background, text, and emphasis colors clear roles in four posters.

Before you begin.

Start with your typography work and the supplied Color poster folder in Color — exercise starter files. Use its Copy.rtf and Image.png. The event details are historical practice content.

Learn the concept.

Color and the color wheel

Words to know.

Hue

A color family, such as blue or red.

A color wheel arranges hues—color families such as red, yellow, and blue—in a circle. It helps you compare neighboring and opposite colors.

Slide 3.

The ideas on a color wheel

Palette

The set of colors you choose for a design.

A swatch is one small sample of a color. A palette is the group of colors you choose for a design. Here navy is used for words, blue for the action, cream for the background, and white for words on the button.

Download
One swatch, a whole palette, and a page

Primary brand color

The main color used to help people recognize a product or company.

The main brand color

Status color

A color used to help show what happened, such as an error or success. Use a clear message with it.

Color that signals status
The idea in practice

See a worked example.

Point to one color and explain its job: for example, “This blue button shows where to book.”

For exampleA cream background keeps the blue booking button easy to spot.

Separate what you can see from what you are guessing about the audience.

For exampleYou can see that the button is blue; you cannot know who prefers blue from a screenshot.

Check readability after you apply colors, not only while you look at the swatches.

For exampleAfter applying color, check that the button label is still easy to read.

Worked color-role example. Start with the supplied event date and ticket invitation. Use a light background, dark readable text, and one contrasting emphasis color for the ticket action. At poster size, check the date and action separately; correct color-group membership alone does not make the message readable. The example does not settle whether neutrals count toward each group or whether photo pixels are exempt.