The eleven-shade color scale from Tailwind CSS is one of those ideas I keep stealing. You know the one: 50 through 950 gives you enough stops for backgrounds, borders, hover states, text, everything. I use it even when I’m not using Tailwind.
But I almost never use the defaults (your site/app ends up looking like every other site built by LLMs).
The fix is not complicated. You don’t need a color theory degree or a five-color palette generator (you know the ones 🥹). You only need two or three color scales, and you can derive them all from a single value.
How to choose your brand hue
Rule of thumb: pick a color that fits the problem, not your personal taste (I like pink but not use it all the time).
