Color shades generator
Generate the tints and shades of a color (light to dark), copyable codes.
- Instant
- Free
- Private (processed locally)
- No sign-up
A monochrome palette in an instant
Enter a color and get its tints (lighter) and shades (darker) on an even scale. Click a swatch to copy its HEX code.
-
Pick the color
With the picker or in HEX.
-
Read the scale
From lightest to darkest.
-
Copy the codes
One click on a swatch.
What the scale is made of
| Type | Mix | Effect |
|---|---|---|
| Tints | with white | lighter |
| Base | #7C3AED | original color |
| Shades | with black | darker |
An 11-step scale (5 tints + base + 5 shades). Simple RGB math, all local. The base color is outlined.
Frequently asked questions
What is the difference between a tint and a shade?
A tint is the color mixed with white: it gets lighter. A shade is the color mixed with black: it gets darker. Together they form a monochrome scale.
How are the values calculated?
To lighten, each RGB channel is moved toward 255 (white); to darken, toward 0 (black), by a percentage. It is simple and predictable, ideal for even steps.
What is this scale for?
To create the variants of a brand color for a design system: hovers, disabled states, backgrounds, borders. Keeping a single base hue ensures visual consistency.
Can I grab the codes?
Yes: each swatch shows its HEX code and copies in one click. You can also enter a HEX value directly or use the color picker.