Skip to content
Convertto

Colour Tints & Shades Generator

Generate lighter tints and darker shades of any colour, with hex values.

To generate tints and shades, pick a base colour and choose how many steps you want in each direction. Tints are produced by mixing toward white and shades by mixing toward black, keeping the hue constant so the whole scale reads as one colour family.

Runs in your browser
Privacy
Runs entirely in your browser — nothing is uploaded
Cost
Free, unlimited, no sign-up

Frequently asked questions

Why do my shades look uneven?

Because HSL lightness does not match perceived brightness — yellow at 50% lightness looks far brighter than blue at 50%. Generating in a perceptual space such as OKLCH gives steps that actually look evenly spaced.

How to use the colour tints & shades generator

  1. 1Pick the base colour.
  2. 2Set the steps each way.
  3. 3The result appears immediately — copy or download it.

Embed this tool

Put the working colour tints & shades generator on your own site. It runs in your visitors' browsers exactly as it does here — free, no account, nothing uploaded.

Share this tool

Related tools

Colour Palette GeneratorBuild harmonious palettes — complementary, triadic, analogous and monochromatic.Image Colour Palette ExtractorPull the dominant colours out of any image as HEX and RGB values.Colour ConverterConvert any colour to HEX, RGB, HSL, HSV, CMYK, LAB and native code — with contrast, tints and harmonies.Colour Blindness SimulatorSee how a colour appears to people with protanopia, deuteranopia and tritanopia.Colour Mixer & BlenderBlend two colours and generate the intermediate steps between them.Random Colour GeneratorGenerate random colours as a free palette or a harmony built around a base colour.

Last updated

More color tools