Color Shades Generator
Generate a full 50 to 950 scale of tints and shades from any base color.
Color Shades Generator
Generate an 11-step scale of tints and shades (50 to 950) from any base color.
50#ECEFFF
rgb(236, 239, 255) • hsl(231, 100%, 96%)100#D2DAFE
rgb(210, 218, 254) • hsl(229, 96%, 91%)200#B0C1FC
rgb(176, 193, 252) • hsl(227, 93%, 84%)300#8BA8FA
rgb(139, 168, 250) • hsl(224, 92%, 76%)400#6492F8
rgb(100, 146, 248) • hsl(221, 91%, 68%)Base
500#3B82F6
rgb(59, 130, 246) • hsl(217, 91%, 60%)600#3565BB
rgb(53, 101, 187) • hsl(219, 56%, 47%)700#2D4984
rgb(45, 73, 132) • hsl(221, 49%, 35%)800#223052
rgb(34, 48, 82) • hsl(223, 41%, 23%)900#181D2E
rgb(24, 29, 46) • hsl(226, 31%, 14%)950#11121A
rgb(17, 18, 26) • hsl(233, 21%, 8%)Export Full Scale
About Color Shades Generator
Create an 11-step perceptual scale of tints (lightened) and shades (darkened) for design systems. Export full scales as Tailwind CSS configurations or CSS custom properties.