Color Shades Generator

Enter a base hex to generate a 50-900 shade scale by varying lightness, with copyable swatches.

Base hex color

Shades

CSS Output

50: '#edfdf9'
100: '#d5fbf1'
200: '#acf6e4'
300: '#75f0d1'
400: '#3debbf'
500: '#16d4a5'
600: '#11a681'
700: '#0d7d61'
800: '#095340'
900: '#052e24'

Loading tool…

How it works

Enter your base hex colour

See the 50-900 shade scale

Copy any shade or the full list

We build calculators, estimators, and AI-powered tools that convert visitors into leads.