Farbabstufungs-Generator: 10 dunklere Töne
Erzeuge aus jeder Hex-Farbe 10 zunehmend dunklere Abstufungen. Kopiere einzelne Hex-Werte per Klick oder exportiere alles als CSS-Variablen oder JavaScript-Array, direkt in deinem Browser.
So verwendest du dieses Werkzeug
- Enter a base hex colour.
- The tool darkens it in ten progressive steps toward black.
- Copy individual shades, or export the set as CSS variables or a JS array.
Shade values
Über Farbton-Generator
Der Farbabstufungs-Generator nimmt eine einzelne Hex-Farbe und erzeugt daraus zehn fortlaufend dunklere Abstufungen. So erhältst du aus einer Ausgangsfarbe eine ganze Tonleiter, wie du sie etwa für Zustände einer Schaltfläche, für Ebenen einer Oberfläche oder für ein abgestuftes Farbsystem brauchst.
Jeder einzelne Abstufungswert lässt sich per Klick als Hex kopieren. Außerdem kannst du die komplette Reihe in einem Schritt exportieren, entweder als CSS Custom Properties für ein Stylesheet oder als JavaScript-Array, um die Werte direkt in Code einzubinden.
Alle Berechnungen laufen lokal in deinem Browser, es wird nichts hochgeladen oder gespeichert. Das Werkzeug ist praktisch, wenn du aus einer Markenfarbe eine konsistente Reihe dunklerer Töne ableiten und sie unmittelbar in CSS oder Code übernehmen willst.
Häufig gestellte Fragen
- Wie viele Abstufungen erzeugt das Werkzeug?
- Es erzeugt aus deiner Hex-Ausgangsfarbe zehn fortlaufend dunklere Abstufungen, also eine vollständige Tonleiter von der Ausgangsfarbe hin zu dunkleren Tönen.
- Kann ich eine einzelne Abstufung kopieren?
- Ja. Jeder Abstufungswert lässt sich mit einem Klick als Hex in die Zwischenablage kopieren, sodass du gezielt einzelne Töne übernehmen kannst.
- In welchen Formaten kann ich alle Abstufungen exportieren?
- Du kannst die gesamte Reihe als CSS Custom Properties für ein Stylesheet oder als JavaScript-Array exportieren, um die Werte direkt in Code einzubinden.
- Wofür sind die dunkleren Abstufungen nützlich?
- Sie eignen sich gut für Zustände wie Hover oder Aktiv bei Schaltflächen, für Ebenen und Schatten in einer Oberfläche oder um aus einer Markenfarbe ein konsistentes, abgestuftes Farbsystem aufzubauen.
- Wird beim Erzeugen der Abstufungen etwas an einen Server gesendet?
- Nein. Alle Berechnungen laufen lokal in deinem Browser. Es wird nichts hochgeladen, übertragen oder dauerhaft gespeichert.