Color Theory Blog
Articles and guides about color theory, UI design, color harmony rules, and web accessibility.
Color Temperature: Kelvin, White Balance & Design
What color temperature actually measures, how Kelvin maps to the warm-cool feeling of a screen, and how to use white-balance thinking to keep a digital palette from drifting orange or blue.
How to Build Gradients That Don't Look Muddy
A practitioner's guide to mixing color gradients in UI: why the midpoint goes gray, how hue interpolation causes mud, and the moves — hue paths, multi-stops, and color spaces — that keep blends clean.
How to Choose a Color Palette: A Step-by-Step Guide
A practitioner's start-to-finish method for choosing a color palette — pick a base hue, choose a harmony rule, assign 60/30/10 proportions, check WCAG contrast, and test in real context.
How to Design Color-Blind-Friendly Palettes
A practitioner's guide to designing color-blind-friendly palettes — the main types of color vision deficiency, why hue alone is never enough, safe pairings, and how to test with simulators.
How to Choose a Color Scheme for Your Website
A practical, web-specific guide to building a real website color scheme — primary, neutrals, readable text, an accent/CTA, semantic states, and link colors — assembled from a generated palette and checked for accessibility.
The 60-30-10 Rule: Balancing Color in Design
A practitioner's guide to the 60-30-10 rule — how color proportion creates balance in UI and web design, with real hex examples, common mistakes, and a repeatable method.
Warm vs Cool Colors: Using Color Temperature in Design
A practitioner's guide to color temperature — which colors are warm vs cool and why, how warm advances and cool recedes, temperature within a single hue, and how to balance both in one palette with real hex codes.
Tints, Shades & Tones Explained
A practitioner's guide to tints, shades and tones — what each one is, how value differs from saturation, and how to build a clean monochromatic scale from a single hue using HSL, with real hex examples for UI surfaces, hovers and disabled states.
HEX, RGB & HSL Color Codes Explained
A practical, no-fluff breakdown of HEX, RGB and HSL color codes — what each one actually encodes, when to reach for which, and why HSL is the format you'll want for adjusting tints and shades.
How to Use a Color Wheel to Pick Colors
A practitioner's guide to actually using a color wheel: how hue, saturation, and lightness map onto it, the RYB-vs-RGB difference modern tools introduce, and how to read each harmony as an angle.
Understanding Color Harmony in UI Design
A practitioner's guide to color harmony in UI design — how each color-wheel scheme works, real hex examples, dominant/secondary/accent roles, and the mistakes to avoid.
WCAG Contrast Ratios Explained: A Designer's Practical Guide
A senior designer's practical guide to WCAG contrast ratios — what 4.5:1, 3:1 and 7:1 really mean, AA vs AAA, large vs normal text, the 1.4.11 non-text rule, and how to measure and fix low contrast.
The Psychology of Color in Branding: A Practitioner's Guide
A senior designer's take on color psychology in branding — what colors actually signal, why the clichés are half-wrong, and a practical process for choosing brand colors on purpose.
Creating Scalable Color Tokens for Design Systems
A hands-on guide to structuring primitive, semantic, and component color tokens — naming conventions, numeric scales, dark mode theming, and the mistakes that quietly break design systems as they grow.
Best Practices for Dark Mode Color Palettes
A practitioner's guide to building dark mode color palettes that actually work — covering dark grays over pure black, elevation, desaturated accents, WCAG contrast, and the mistakes I see most often.
Split-Complementary vs Triadic Palettes: A Designer's Practical Guide
A hands-on comparison of split-complementary and triadic color schemes — the exact wheel angles, the mood each produces, worked hex examples, and how to choose between them.