Practical Color Theory for People Who Code
summary
Claim: developers can treat color as information and reproduce predictable palettes by code. Uses hsl color space and Sass functions to generate palettes, making hue degrees (0–360, ~30° between primaries) first-class. Shows the rule compliment = hue + 180°, explains neutrals arise from mixing complements and desaturation, and emphasizes contrast/lightness for accessibility. Demo is a one‑value theming prototype that populates a full palette from one hue and it works (with minor performance hiccups on the projector).
AI-written summary · about
chapters (36)
- 0:00Introduction
- 1:09This is not about you
- 2:07Stop being creative
- 2:46Web is creative
- 4:02Its hard work
- 7:15Color is information
- 7:42Purpose of color
- 8:14Bright colors
- 11:31Art resources
- 13:16Pop quiz
- 15:14Color wheel
- 17:04Demo
- 18:09Complementary Colors
- 19:01HSL
- 19:42Orange
- 20:09Complement
- 21:57Color Relationship
- 24:08Neutrals
- 26:13HSL Arguments
- 28:52Grayscale
- 29:44Accessibility
- 29:58Menu
- 30:31Designers have a toolkit
- 35:26Learning from others
- 35:47Building systems
- 37:03CSS
- 37:13Conclusion
- 37:44Future Plans
- 38:55Complementary Color Schemes
- 39:26HSL Module
- 40:18Contrast
- 43:05HSL for Contrast
- 44:49HSL for Background
- 46:58Changing Colors
- 50:54programmatically compatible colors
- 51:28dream world
related talks
25mPractical Color Theory for People Who Code
19mWhen colour theory meets technology
43mRethinking Colors in Design Systems: A CSS Approach to Idiomatic Design
01h 16mUnderstanding & using color for storytelling in data visualization
28mBuilding the Dark Mode of Your Dreams with Color Science
42m“The Interaction of Color Systems”
41mTMNT Guide to Color Theory
36mThe Magic of Color