How color shade generator works
A tint is a color mixed with white (lighter) and a shade is a color mixed with black (darker). This generator takes a base hex color and produces a row of tints stepping toward white and a row of shades stepping toward black, so you get a full lightness scale from a single hue.
Each step mixes the base color with white or black by an even fraction t = i/(steps+1), so the first step is a subtle shift and the last step is close to — but never quite — pure white or black. Every step keeps the original hue, only the lightness changes. Each color is reported in hex, RGB and HSL so it drops straight into any tooling.
Enter a base color, pick how many steps you want on each side, and choose tints, shades or both. Click any swatch to copy its value. This is distinct from the Color Palette Generator, which derives color harmonies (complementary, analogous, triadic) by rotating the hue rather than shifting lightness.
Frequently asked questions
What is the difference between a tint and a shade?
A tint is a color lightened by mixing it with white; a shade is a color darkened by mixing it with black. A tone, by contrast, is a color mixed with gray (it lowers saturation). This tool focuses on tints and shades.
How are the steps calculated?
Each step mixes the base color with white (for tints) or black (for shades) by t = i/(steps+1). With 5 steps the mix percentages are about 17%, 33%, 50%, 67% and 83%, giving an even lightness gradient without ever reaching pure white or black.
Does this change the hue?
No. Mixing with pure white or black in RGB changes only the lightness, so every tint and shade keeps the original hue. Use the Color Palette Generator if you want related hues (complementary, analogous, triadic) instead.
Why is my darkest shade not pure black?
By design the last step stops short of pure black so the base hue is still visible. Increase the number of steps for a longer gradient, or use the Color Converter to mix toward an exact black manually.
