Shades and Tints Generator

Generate shades (darker) and tints (lighter) of any color. Perfect for creating consistent color scales.

HEX#6366F1
RGBrgb(99, 102, 241)
HSLhsl(239, 84%, 67%)

Color Palette

Frequently Asked Questions

What is the difference between shades and tints?

Shades are created by mixing a color with black (making it darker). Tints are created by mixing with white (making it lighter).

How many steps should I use?

10 steps is standard for design systems like Tailwind CSS. Use fewer for simpler palettes or more for fine-grained control.