Kostenlos · Design und CSS
Tailwind-Farbabstufungen-Generator.
Mache aus einer Markenfarbe eine vollständige Tailwind-Palette von 50 bis 950 in OKLCH, mit Hex-Werten, Kontrasten und Code für Tailwind v4 @theme, v3 oder CSS-Variablen.
Loading the calculator…
So verwenden Sie das Tool: Tailwind-Farbabstufungen-Generator
Geben Sie Daten ein oder wählen Sie eine Datei. Passen Sie die Einstellungen an, erstellen Sie das Ergebnis und prüfen Sie es vor dem Kopieren oder Herunterladen.
Grenzen und unterstützte Formate
Ihre Eingaben werden auf Ihrem Gerät verarbeitet.
Technische Hinweise auf Englisch
Lightness steps imitate Tailwind’s default palette; check important text pairs for contrast. Everything is calculated in your browser; nothing you type is uploaded.
Each step has a target OKLCH lightness from 0.971 (50) to 0.258 (950); chroma rises and falls around the middle in proportion to your colour, and is reduced where needed to stay in sRGB.
Teal #0d9488 becomes 11 shades from #f2f7f6 to #072a26 and is kept exactly at step 600.