Color Theory

Explore & Discover

Color is a language — designers use it to make you feel things before you read a single word. Look around wherever you are right now: what colors do you see? Why do you think those colors were chosen? Visit the websites of three Utah brands — maybe the Utah Jazz (nba.com/jazz), REI's Salt Lake store (rei.com), and a local food brand — and write down the main colors each uses. Then read "Color Theory Basics" at canva.com/colors/color-wheel. Notice the color wheel: primary colors, secondary colors, the relationships between them. Color isn't random in good design — it's a decision with a reason. You're ready for the next step when you can name the three primary colors, three secondary colors, and one reason a real brand chose its main color.

Learn the Basics

Three big color relationships power most great designs: complementary (opposite on the wheel), analogous (neighbors on the wheel), and triadic (evenly spaced triangle). Visit Adobe Color at color.adobe.com and click "Create" to open the color wheel. Switch between Complementary, Analogous, and Triadic modes and notice how the colors shift. Then explore the "Explore" tab — thousands of real designers have shared their palettes. Search "Utah" or "mountain" and see what comes up. Find three palettes you love and three you find ugly. In your notebook, write why for each group. Good taste is just trained observation. You're ready for the next step when you can identify whether a design is using complementary, analogous, or triadic colors and name the relationship correctly.

Build Your First Project

Now make your first color decisions for a real design project. Go to Canva (free at canva.com) and start a new blank poster — 8.5 x 11 inches. Create three different versions of a poster for the same fake event: "Utah Coders Meetup." Version 1: use only warm colors (reds, oranges, yellows). Version 2: use only cool colors (blues, greens, purples). Version 3: use complementary colors. Keep everything else the same — same layout, same fonts, same words. Compare them: which feels more energetic? More calm? More trustworthy? Screenshot all three. This single exercise teaches you more about color than a week of reading. You're ready for the next step when you have three poster versions and can describe how each one makes you feel differently.

Experiment & Iterate

Color accessibility matters — about 8% of males have color blindness, so red-green combinations are invisible to many people. Go to color.adobe.com, open your favorite palette from the last step, and click the accessibility icon to check contrast ratios. Then use the Coblis color blindness simulator at color-blindness.com/coblis-color-blindness-simulator to upload your best poster and view it through different types of color blindness. Does it still work? Fix any versions that don't. Then look up WCAG contrast standards (Web Content Accessibility Guidelines) — the rule is 4.5:1 contrast ratio for text. Check your poster text against its background. Accessible design is just good design. You're ready for the next step when all three of your poster versions pass the accessibility contrast check.

Advanced Techniques

Color systems — carefully chosen palettes that work together across many uses — are how real brands stay consistent. Research three companies' public design systems: Apple's Human Interface Guidelines (developer.apple.com/design), Google's Material Design (m3.material.io), and Atlassian's design system (atlassian.design). Notice how each defines primary, secondary, neutral, and semantic colors (green for success, red for error). Build your own five-color design system in Adobe Color: one primary, one secondary, one accent, one background, and one text color. Make sure all text colors pass accessibility checks. Document your palette in your notebook with the hex codes. You're ready for the next step when you have a five-color design system with documented hex codes and all text-background pairs pass 4.5:1 contrast ratio.

Final Project Showcase

Apply your color system to a complete design challenge: create a full brand identity for a fictional Utah outdoor company — maybe a mountain biking app, a skiing gear brand, or a canyoneering guide service. Design a logo, a business card front, and a social media profile image, all using only your five-color system. Use Canva or the free version of Figma at figma.com. Write a one-page "color rationale" document explaining why you chose each color and what feeling it's supposed to create. Share your complete brand package on Behance.net or post it to the Canva community. Ask for specific feedback: "Does the palette feel outdoorsy?" "Does it look professional?" You're ready for the next step when a stranger looking at your brand package can correctly guess what kind of company it is based only on the colors and shapes.