Tailwind Color Generator
Generate a Tailwind-style color scale (50→950) from one color, via OKLCH. Everything runs on your device — fast, free, and private.
The result will appear here…
or press Ctrl+Enter
Everything runs in your browser. Your data is never sent to our servers.
728 × 90Ad Space AvailablePlace your ad here
Example
Example Input
#0ea5e9
Example Output
50 #f0f9ff · 500 #0ea5e9 · 950 #082f49
How to Use
- 1Enter a color or data in the Input field.
- 2Set "More settings" if needed, then click Run (or Ctrl+Enter).
- 3Copy the result — a swatch is shown next to each value.
About Tailwind Color Generator
The Tailwind Color Generator builds an 11-step scale (50, 100, … 950) from one base color, using the OKLCH space so lightness between steps feels perceptually even.
Paste the result into your Tailwind config. To export it as a ready-made config block, use Export Tailwind.
FAQ
Is my data sent to a server?
No. Tailwind Color Generator runs entirely in your browser — your data never leaves your device.