Farbton-Generator
Generiere helle und dunkle Abstufungen jeder Farbe für Designsysteme und UI-Paletten. Ausgabe als HEX, RGB oder HSL. Kostenlos, 100% in deinem Browser.
Referenz
Was sind Farbtöne und Schattierungen?
In der Farbtheorie ist ein Farbton (Tint) jede Farbe gemischt mit Weiß (heller), und eine Schattierung (Shade) jede Farbe gemischt mit Schwarz (dunkler). Zusammen bilden sie eine monochromatische Palette — Variationen eines einzelnen Farbtons auf verschiedenen Helligkeitsstufen. Dieses Tool generiert eine vollständige Skala von Weiß über deine Basisfarbe bis Schwarz und liefert dir eine sofort einsetzbare Farbrampe für Design und Entwicklung.
Anwendungsfälle für Farbabstufungen
Designsysteme — generiere eine 9- oder 11-stufige Farbskala für eine Markenfarbe, nach dem Muster von Tailwind CSS (50–950), Material Design und den meisten modernen Designsystemen. UI-Komponentenzustände — verwende hellere Töne für Hintergründe und Hover-Zustände, die Basisfarbe für primäre Aktionen und dunklere Schattierungen für Text, Rahmen und aktive Zustände. Datenvisualisierung — erstelle sequenzielle Hell-zu-Dunkel-Farbskalen für Choroplethenkarten, Heatmaps und Diagramme, bei denen die Intensität die Größe darstellt. Barrierefreiheit — finde Farbkombinationen, die die WCAG-Kontrastanforderungen erfüllen (4,5:1 für normalen Text, 3:1 für großen Text).
Wie Schattierungen generiert werden
Schattierungen werden durch lineare Interpolation im RGB-Farbraum von Weiß (#FFFFFF) über die Basisfarbe bis Schwarz (#000000) generiert. Bei N Schattierungen erscheint die Basisfarbe in der Mitte der Skala. Jeder Schritt mischt gleichmäßig und erzeugt eine konsistente Helligkeitsprogression. Die Ausgabe ist in HEX, RGB und HSL verfügbar — kopiere einzelne Werte oder die gesamte Palette auf einmal.
Datenschutz
Alle Farbgenerierung läuft 100% in deinem Browser. Es werden keine Daten an einen Server gesendet.