Jesse Showalter on YouTube · Open on YouTube
Design foundations · Novice · Lesson 9 of 99 · 13 min video, then about 2 hours of practice
Colour for interfaces
After this you can build a small, purposeful UI palette with a neutral ramp and semantic states, and check it for contrast as you go.
Why it matters
UI colour is a different problem from artistic colour: you need a large neutral range, one or two accents, and unambiguous semantic colours for success, warning and error. Focus on building a *ramp* (a set of tints and shades of one hue) rather than picking individual colours, because that is what design systems and Figma variables expect later. Two traps: pure black text on pure white is harsher than a very dark grey, and picking colours by eye without a contrast check will produce a palette you must rebuild once you reach accessibility.
How to use this resource
Specifically about interface colour rather than colour theory in general, which is the distinction most tutorials miss.