Generator für Farbschattierungen und Tönungen online
Generieren Sie Tönungen und Schattierungen einer Farbe für Ihre Palette, direkt in Ihrem Browser.
Tints (lighter)
#57ff37#74ff5b#92ff7e#b0ffa1#ceffc4#ebffe8Base
#39ff14Shades (darker)
#061a02#0e4005#176608#1f8c0b#28b30e#30d911Tints = mixed toward white, shades = mixed toward black.
🔒 100 % clientseitig — keine Daten gesendet
Generieren Sie sofort eine Palette aus helleren Tönungen und dunkleren Schattierungen einer einzelnen Farbe. Ideal, um eine konsistente Skala (50 bis 900) für Ihre Designsysteme und Oberflächen zu erstellen. Das Tool läuft zu 100 % in Ihrem Browser, daher wird keine Farbe online gesendet.
What is it for?
- ▸ Eine konsistente Farbskala für ein Designsystem erstellen
- ▸ Hover-, Active- und Disabled-Varianten eines Buttons erhalten
- ▸ Aus einer Markenfarbe barrierearme helle Hintergründe und dunklen Text generieren
- ▸ Eine Tailwind-Farbe oder CSS-Variable in zehn Stufen erweitern
FAQ
Was ist der Unterschied zwischen einer Tönung und einer Schattierung?
Eine Tönung entsteht, indem einer Farbe Weiß hinzugefügt wird, um sie aufzuhellen; eine Schattierung entsteht durch Hinzufügen von Schwarz, um sie abzudunkeln.
Wie generiere ich eine Palette aus einer einzelnen Farbe?
Geben Sie Ihre Farbe in Hex, RGB oder HSL ein, und das Tool berechnet automatisch eine Reihe hellerer und dunklerer Schattierungen, die Sie direkt kopieren können.
Sind diese Farben mit Tailwind CSS kompatibel?
Ja, die generierte Skala folgt der von Tailwind verwendeten Logik von 50 bis 900, sodass Sie sie direkt in Ihre Theme-Konfiguration übernehmen können.