Developer Tools ›
Color Shades & Tints
Generate ten shades and ten tints from any base color. Perfect when building a design system or matching a brand palette.
Private - runs in your browser
No signup required
Free forever
How to use Color Shades & Tints
- Pick a base color.
- See the shades (darker) and tints (lighter).
- Click any swatch to copy its HEX.
Features
- 10 shades + 10 tints
- One-click HEX copy
- Pure HSL math
Why use it
- Cohesive palettes fast
- Design-system-ready
- No external tool
Frequently asked questions
What is a shade vs a tint?
A shade adds black; a tint adds white. We use HSL lightness adjustments for predictable steps.