Tailwind Color Generator

Generate a complete Tailwind CSS shade scale (50-950) from a single base color and copy the configuration code block.

Generate Tailwind Color Shades

Choose a base color hex or select one visually. We calculate standard Tailwind CSS color steps (50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950) ready to paste into your tailwind config.

Shades Preview

Shades synchronized.
Advertisement banner for developer tools