Why is the gray color of TailwindCSS dark blue?

Question

The color that comes out when you do "bg-gray-900" is not gray. I checked. It's blue. Dark blue. But why did they do that? Why do they say gray?

seanwilson · Accepted Answer

It's a common UI/web design trick now to brand your color palette more by mixing in a little of your primary color into your "gray" swatch. Gray gets used a lot so this has a subtle but noticeable difference. Tailwind has a few gray swatches you can pick from (https://tailwindcss.com/docs/customizing-colors) where "neutral" is all gray if that's what matches your brand.I have a tool for creating Tailwind color palettes you might find interesting here (https://inclusivecolors.com) where you can visualize how the hue of Tailwind's "gray" shifts a little to the left and the saturation goes from high to low as the gray gets lighter (you'll need to load the palette first via "Import" then "Tailwind"), and customise it if you want.

jsheard · Answer

https://tailwindcss.com/docs/customizing-colorsTheir "neutral" is the perfect gray you're looking for.Why their "gray" is actually blue, I have no idea.

brudgers · Answer

Design Tip Never Use Blackhttps://news.ycombinator.com/item?id=4357002

Why is the gray color of TailwindCSS dark blue?

The color that comes out when you do "bg-gray-900" is not gray. I checked. It's blue. Dark blue. But why did they do that? Why do they say gray?

https://tailwindcss.com/docs/customizing-colors
Their "neutral" is the perfect gray you're looking for.
Why their "gray" is actually blue, I have no idea.

Design Tip Never Use Black
https://news.ycombinator.com/item?id=4357002