Click any swatch to copy its HEX code.
Frequently asked questions
What are tints and shades?
A tint is your base color moved toward white, a shade is the same color moved toward black. This tool steps the HSL lightness value up and down in 9 even steps from your base color, so every swatch belongs to the same hue family.
How do I copy a color?
Click any swatch and its HEX code is copied to your clipboard instantly.
Why do some colors look washed out at the extremes?
Very light tints and very dark shades naturally lose saturation. That is how real color mixing works, not a bug.
Preview
Related free tools
Free CSS Button Generator | Style Buttons Online
Free CSS button generator. Customize colors, padding, and radius with live preview, then c
Free HEX RGB HSL Color Converter
Free color converter. Convert between HEX, RGB and HSL instantly, preview the color and co
Free Color Contrast Checker | WCAG Accessibility Tool
Free color contrast checker. Test text and background colors against WCAG AA and AAA stand