← Alle Text-Tools

Tailwind-Farbpaletten-Generator

Eine Tailwind-CSS-Farbskala von 50 bis 950 aus Ihrer Markenfarbe erstellen, für v3 oder v4.

  • Kostenlos
  • Ohne Anmeldung
  • Funktioniert auf jedem Gerät

Über Tailwind-Farbpaletten-Generator

Geben Sie Ihre Markenfarbe ein und erhalten Sie eine vollständige Skala von 50 bis 950 im von Tailwind verwendeten Format, bereit für die Konfigurationsdatei in v3 oder die Theme-Variablen in v4. Helle Stufen eignen sich für Hintergründe, 500 ist ungefähr Ihre Grundfarbe, und die dunkelsten Stufen funktionieren für Text und den Dunkelmodus.

So verwenden Sie Tailwind-Farbpaletten-Generator

  1. Gib deine Markenfarbe als HEX-Code ein.
  2. Wähle die Ausgabe für Tailwind v3 oder v4.
  3. Kopiere die Farbskala von 50 bis 950 in dein Tailwind-Setup.

Warum dieses Tool?

Auch bekannt als

Häufig gestellte Fragen

Wo füge ich die erzeugten Tailwind-Farben ein?

In v3 fügen Sie sie unter theme.extend.colors in der tailwind.config.js hinzu. In v4 fügen Sie die Variablen in den @theme-Block Ihrer CSS-Datei ein.

Welche Abstufung passt zu meiner ursprünglichen Farbe?

Deine Eingabefarbe wird auf der Skala an der Stufe platziert, die ihrer Helligkeit am nächsten liegt, meist nahe 500. Sieh dir die Vorschau an, um zu sehen, auf welcher Zahl sie gelandet ist.

Was ist der Unterschied zwischen der v3- und der v4-Ausgabe?

Version 3 legt Farben in der Konfigurationsdatei ab, während Version 4 CSS-Theme-Variablen nutzt. Wähle die, die zur Tailwind-Version in deinem Projekt passt.

Ist Tailwind-Farbpaletten-Generator kostenlos?

Ja. Tailwind-Farbpaletten-Generator auf Toolipedia ist kostenlos nutzbar, ohne Anmeldung und ohne Wasserzeichen.

Ist die Nutzung sicher?

Ja. Alles wird in Ihrem Browser berechnet, und nichts von Ihren Eingaben wird an unseren Server gesendet.

Funktioniert es auf meinem Smartphone?

Ja. Es funktioniert in jedem modernen Browser auf Android und iPhone sowie auf Tablets und Computern. Sie müssen nichts installieren.

Brauche ich ein Konto?

Nein. Öffnen Sie einfach die Seite und nutzen Sie das Tool. Keine Anmeldung, keine E-Mail-Adresse nötig.

Kann ich Tailwind-Farbpaletten-Generator auf meiner eigenen Website einsetzen?

Ja. Nutze unter dem Tool die Schaltfläche „Auf deiner Website einbetten“, um ein kurzes Stück Code zu kopieren und in deine Seite einzufügen. Es ist kostenlos, braucht kein Konto, und das Tool funktioniert weiter innerhalb deiner Seite.

Ähnliche Tools