Tints & Shades Generator
Lighten and darken any color into a full range — in your browser.
About Tints & Shades
A tints-and-shades generator creates lighter and darker variations of a color. Enter a hex color and get a range of tints (mixed toward white) and shades (mixed toward black), each with a hex code to copy — perfect for building UI states and color scales.
Frequently asked questions
- What's the difference between a tint and a shade?
- A tint is the color mixed with white (lighter); a shade is the color mixed with black (darker). Together they form a value scale of one hue.
- How is this different from an HSL lightness sweep?
- This mixes in RGB toward white/black, which naturally desaturates at the extremes — the classic 'tints & shades' look rather than a pure lightness change.
- Can I copy each color?
- Yes. Every tint and shade shows a hex code ready to copy.
More tools
Unit ConverterNetToolkitClick CounterClick TestPassword GeneratorID GeneratorStopwatchTimerTodo ListWord CounterJSON FormatterJSON VisualizerQR Code GeneratorPercentage CalculatorAge CalculatorBase64 Encode / DecodeCase ConverterHash GeneratorURL Encode / DecodeUnix Timestamp ConverterColor ConverterLorem Ipsum GeneratorBMI CalculatorTip CalculatorJWT DecoderJWT EncoderRegex TesterSlugifyText DiffRemove Duplicate LinesDiscount CalculatorLoan CalculatorTime Duration CalculatorContrast CheckerGradient GeneratorPalette GeneratorImage to Base64Image ResizerFavicon GeneratorMerge & Split PDF