HSLA > HEX
I don't have many hills I'm willing to die on. But this is one: HSLA > HEX.
Note
This was an email that I sent out to Becca’s InsideTheSquare email list during a “take-over” of her social channels, the Week of Oct 26th, 2025.
This email, I'm coming in hot with the opinions.
Hex Codes Are Overrated
I don't have many hills I'm willing to die on. But this is one: HSLA > HEX. Now I don't want to get into a big fight about this, and these views are my own, not that of Becca's. But Becca has given me a platform, and I'm gonna make my voice heard.
Why Hex Kinda Sucks
It's unreadable: what the heck is #7fa3cc? It looks like a cat ran across the keyboard.
It's inflexible: want to change the brightness? Congrats, you're googling “hex color converter” for the hundredth time.
It's opaque: You can't use opacity out-of-the-box. (Well, you can, but in the Custom CSS area of Squarespace you have to wrap it in squiggles ~'#7fa3cc80')
Hex codes are basically the dial-up internet of the coloring world. Each 2-character pair corresponds to red green or blue in a hexadecimal format. Who can read that?? It got the job done back in the day, but time to move on.
HSLA Is the Grown-Up in the Room
HSLA is so much more human readable:
Hue (the actual color, on a 360° color wheel
Saturation (how colorful or gray it is)
Lightness (how bright or dark it is)
Alpha (opacity)
It reads like plain English.
hsla(200, 100%, 50%, 0.5)
= “blue, very colorful, medium bright, half see-through.”
Tell me that's not nicer than #7fa3cc80.
Bottom Line
Now ideally, you'll use the color variables that we talked about on Tuesday. If you' haven't watched that video, check it out here.
But if you're hard coding your colors, I hope you'll consider using HSLA. Hex had its time. We had some fun together. But HSLA > HEX.
If you'd like to stay in touch, sign up for my Newsletter, Subscribe to my YouTube channel, or Follow me on Instagram, would love to stay connected.
