Color Shades Generator
Generate a HEX palette of tints and shades from a base color—useful for design-system color scales. Everything runs in your browser.
FAQ
How are the shades created?
The base color is mixed with white for tints and with black for shades at even ratios.
How many steps can I generate?
1–9 steps each way, up to 19 colors including the base.
Is my color sent to a server?
No. All generation happens entirely in your browser.
Related tools
Convert between HEX, RGB and HSL color codes with a live preview.
Minify CSS by removing comments and unnecessary whitespace while preserving string values. Everything runs in your browser.
Apply a colored tint to an image with adjustable strength. Everything runs in your browser—your images never leave your device.
Convert between px, rem, em, pt, and % based on a root font size. Handy for responsive typography. Everything runs in your browser.