Color Shades & Tints Generator
Enter a base HEX color and get a full 50–900 scale — tints toward white and shades toward black, Tailwind-style. Click any swatch to copy its HEX.
Runs entirely in your browser. Nothing is uploaded.
Runs entirely in your browser. Nothing is uploaded.
How it works
STEP 1
Pick a color
Type or paste any HEX color code into the input, or use the color picker.
STEP 2
Generate the scale
Click Generate and see 11 swatches from 50 (lightest) to 900 (darkest).
STEP 3
Copy & use
Click any swatch to copy its HEX, or copy the full scale as CSS custom properties.