Tint and Shade Generator
Create lighter tints and darker shades of any color.
A full scale from one color
Tints lighten a color toward white and shades darken it toward black. Generating them from a base gives you a ready-made scale for hover states, borders, and depth.
Enter a color and it produces a row from its darkest shade to its lightest tint, as swatches with codes. It is the fastest way to build a consistent scale around a brand color.
Practical and private
All the color math runs in your browser, so nothing you enter is uploaded.
Frequently Asked Questions
What are tints and shades?
A tint is a color mixed with white, a shade is a color mixed with black. Together they give a range of a single color.
Where are they used?
For hover and active states, borders, and building a consistent color scale from one base color.
Can I copy the codes?
Yes. The hex codes are shown and one click copies them.
Browse the full set of free, private, in-browser tools.