Color Palette Generator
Pick a base color and generate tints + shades, presented as a sortable table.⌘⏎ run · ⇧⌘C copy · ⎋ resetINPUTTotal shades
9
#3b82f6OUTPUT
❯ _Run an operation to see results here.then press ⌘⏎
ADSponsored
What is Color Palette Generator?
The Color Palette Generator takes any base color and builds a harmonious set of tints and shades around it, entirely in your browser. Pick a color, and it derives lighter and darker variants with their HEX, RGB and HSL values ready to copy. It is handy for building UI themes, gradients, or accessible color scales without a design tool.
How to use it
- 01Pick or paste a base color (HEX, RGB or a color name).
- 02Review the generated tints and shades with their color codes.
- 03Copy any swatch value with one click for your CSS or design file.
FAQ
Does this send my colors anywhere?
No — palettes are generated locally in your browser; nothing is uploaded.
What formats can I copy?
Each swatch shows HEX, RGB and HSL, and any of them copies with a click.
Can I use this for accessible palettes?
Yes — the tint/shade scale helps you pick pairs with enough contrast for WCAG.
Examples
Cyan palette{
"baseColor": "#06b6d4",
"shadeCount": 9
}