Create Amazing Color Schemes for Your UI/UX Design Projects
Arash Ahadzadeh · UI/UX Designer | University Lecturer
A structured, science-based framework for picking UI colors that replaces guesswork and pre-made palette shopping with an actual method.
A method, not a mood board
This course opens with a direct pitch: color choice is science, not talent, and once you understand the mechanics you stop needing pre-made palettes off the internet. It delivers on that promise in its first half by walking through hue, saturation, and value, the color wheel's primary/secondary/tertiary structure, and the six standard harmonies, monochromatic, complementary, split-complementary, analogous, triadic, and tetradic. Rather than leaving these as abstractions, the course matches each harmony to real screenshots (Booking.com's blue-and-orange complementary scheme, Orbit's monochromatic palette) so the terminology sticks to something visible.
The color psychology and demographics section is thinner but useful in a practical, checklist way: red for urgency, blue for trust, the gendered preference data showing purple skewing toward women and both sexes converging on blue and disliking brown and orange. It is a shorthand for briefs and client conversations, not a scholarly treatment, and the course is honest about that scope.
From theory to a working palette
The stronger half is the applied one. The course defines the actual inventory a UI needs, primary, optional secondary, accent, three semantic colors for warning/error/success/info, neutral tones, and an optional chart palette split into categorical, sequential, and diverging types. That inventory alone is a useful mental checklist that most beginner color tutorials skip.
The two capstone projects, a landing page and a personal finance app, are where the course earns its keep. Colors are built manually inside Figma by nudging HSB sliders off a locked base hue rather than pulling from Coolors' generator, and the palette is then applied using a 60-30-10 ratio across backgrounds, cards, CTAs, and chart segments. The accessibility pass that follows, running contrast checks against WCAG AA and AAA thresholds and simulating monochromatic, protanopia, and blue-cone monochromacy vision, turns "make it pretty" into "make it pass," which is the habit most self-taught designers never build.
The pacing has real gaps. Several lessons compress fast: gradients get one technique (shift an analogous hue rather than jumping across the wheel) and move on, and the psychology section trades depth for breadth. Advanced practitioners will find little new past the halfway mark, and the course does not touch dark-mode systems, tokenized design systems, or brand color strategy beyond a single logo-color example.
What it does well is sequencing: theory before harmony, harmony before application, application before validation. A beginner who follows it end to end will finish able to explain why a palette works instead of just liking how it looks, and will have a checklist for accessibility that many working designers still skip. At under two hours for twenty lessons plus two full project walkthroughs, it is compact rather than exhaustive, a solid on-ramp rather than a reference to return to.
The standout
Building a palette live in Figma by dialing HSB values off a single base hue, then applying it under the 60-30-10 rule to a grayscale-first website and app mockup, is the one technique worth the price alone.
What you will learn
- How to break any color into hue, saturation, and value, and derive tints, shades, and tones from a base color
- The six classic color harmonies (monochromatic, complementary, split-complementary, analogous, triadic, tetradic) and when each suits a UI
- How to structure a full UI color system: primary, secondary, accent, semantic (warning/error/success/info), neutral, and chart/data-visualization colors
- The 60-30-10 ratio for applying a palette across a real interface
- How to build gradients using analogous or monochromatic hues instead of arbitrary color pairs
- How to validate a palette for WCAG contrast ratios and colorblind accessibility using Coolors, Stark, the Contrast Figma plugin, and WhoCanUse
Best for: Beginner and early-intermediate UI/UX designers, and developers, who pick colors by instinct or copy pre-made palettes and want a repeatable method instead.
Skip it if: Designers who already understand color theory and contrast tooling, or anyone wanting deep coverage of print color spaces, brand identity color strategy, or dark-mode-specific systems.