Colour, explained for people who build
Practical guides on colour formats, accessibility and CSS — written for developers and designers, not theory for its own sake.
How to use OKLCH in CSS
The modern, perception-based colour format — what it is, why it beats HSL, and how to use it today.
Designing for colour blindness
How to build palettes that work for everyone. Coming soon.
HEX vs RGB vs HSL: which to use
A plain-language guide to choosing a colour format. Coming soon.
Practical colour guides for developers and designers
The Color Code Kit blog focuses on colour as it actually shows up in real work — choosing formats, building accessible palettes, and using modern CSS colour features. Rather than abstract colour theory, the goal is guidance you can apply to the next thing you ship: which format to reach for, how to keep text readable, and how to build colour systems that scale.
Topics we cover include the modern OKLCH colour format and why it is replacing HSL in design systems, the practical differences between HEX, RGB, HSL and OKLCH, designing palettes that work for people with colour vision deficiency, and getting the most from colour tokens in frameworks like Tailwind. Each guide links back to the relevant tool so you can try the technique immediately.
More guides are on the way. In the meantime, jump into the colour picker, converter, contrast checker or colour-blindness simulator, or browse the colour code references.