How are the shades calculated?

Tints linearly interpolate each RGB channel toward white and shades toward black. The 50–900 tonal scale keeps the original hue and saturation while sweeping HSL lightness, which is how design-system colour ramps are built.

Are my colours uploaded anywhere?

No. Every tint, shade and tonal step is computed locally in your browser with JavaScript. Nothing about your colour is sent to a server.

Are the generated hex values accurate?

Yes. The conversions use standard sRGB and HSL maths, so the hex output is deterministic and matches what your design tool will render.

Color Shades & Tints Generator

Generate tints, shades and a full tonal scale from any base colour.

Colour shades & tints generator

Enter any base colour and instantly get a full set of tints (lighter), shades (darker) and a 50–900 tonal scale — the kind of colour ramp used in design systems like Tailwind or Material.

Click any swatch to copy its hex code. All shades are computed locally in your browser using standard sRGB and HSL maths — nothing is uploaded.