Color Converter

Convert HEX/RGB/HSL and auto-generate a Tailwind-style 50–900 tint and shade scale.

HEX and RGB are the same numbers wearing different clothes — three sRGB channels, written base 16 or base 10. HSL is a genuine transform, and it exists because the other two are hopeless for the thing designers actually do: take this colour and make it slightly lighter. In RGB that means moving three values at once and hoping; in HSL it is one number.

That is also why a tint and shade scale is generated rather than picked. Stepping lightness while holding hue and saturation gives you a family that reads as one colour, where hand-chosen steps tend to drift in hue and produce a ramp that looks subtly muddy in the middle.

A caution on the numbered scales: 50 through 900 is a convention about position in a ramp, not about contrast. Whether text on a given step is readable is a separate measurement, and worth checking rather than assuming.