Tints & Shades
Generate perfectly weighted tints and shades for any base color. Perfect for building design systems and UI variants.
Generated Scale
#ffffff
#e1e5ff
#c1ccff
#9fb4ff
#769cff
#3a86ff
#006ade
#004fbd
#00369e
#00207f
#000000
What are Tints?
A tint is produced by mixing a color with white, which increases lightness. In this tool, tints are generated on the left side of the base color.
What are Shades?
A shade is produced by mixing a color with black, which reduces lightness. In this tool, shades are generated on the right side of the base color.