Hex, rgba, or hsla?

chiangs profile image Stephen E. Chiang ・1 min read

I was reading an older edition of Design for Hackers last night and there was a statement that hsl was the latest and greatest due to its easier use compared to hex and it got me thinking...I almost always use rgba, and never really gave it a second thought.

So do you prefer to use hex, rgba, hsla, or mix them? Why?


markdown guide

HSL is definitely the most useful when building a palette; start with your base color, then just tweak the saturation and lightness as needed to build off of that.


Also not so biased against darkness when generating random colors compared to rgb.


For coding, almost always RGB (I only list the alpha channel if it needs a value other than full opacity). It's a bit easier to understand right off the bat (at least for me) than hex values are and it mirrors how the computer is (probably) actually handling colors.

When actually deciding on color schemes though, I often use HSL or HSV models, as they're easier to extrapolate theming from. For example, it's trivial to find the complement of a color using a HSL or HSV model, because you only have to adjust one of the values, while for RGB you need to adjust all three (in potentially complicated ways if you don't want the direct complement of the base color).


I use hex most of the time, though HSL and RGB are easier to use for animating


Hex 100% of the time - that's how I've always done it! Never heard of HSL, I'll check it out.


Same...hex and rgb...but now that it has wide-spread browser support I suppose it's also great way to double-check accessibility by checking the luminance contrast since that is what enable the color-blind to distinguish dark against light. ref: MDN