Color Theory for Developers Who Can Not Design

May 1, 2026

I've always been terrible at picking colors. Every side project I build ends up looking like it was designed by a robot โ€” because it was. But learning the basics of color theory changed that.

The 60-30-10 Rule

The easiest rule in design:

  • 60% dominant color (usually your background)
  • 30% secondary color (cards, sections)
  • 10% accent color (buttons, links, highlights)

That's it. Follow this and your app won't look like a clown exploded.

HSL > Hex

If you're still picking colors in hex, switch to HSL (Hue, Saturation, Lightness). It's way more intuitive:

  • Hue = the actual color (0-360 on the color wheel)
  • Saturation = how vivid (0% is gray, 100% is full color)
  • Lightness = how bright (0% is black, 100% is white)

Want a darker shade of your button color? Just lower the lightness. Easy.

My Color Palette Generator

I built a quick tool that generates harmonious palettes using different color schemes โ€” analogous, complementary, triadic, and more. You can lock colors you like and regenerate the rest.

Check it out on my projects page.

Takeaway

You don't need to be a designer. You just need a few rules and a decent palette generator.