Monochromatischer Farb-Generator
Erstelle mit diesem monochromatischen Farb-Generator eine Palette aus einer Basisfarbe. Gib einen 3- oder 6-stelligen Hex-Code ein. Das Werkzeug behält Farbton und Sättigung bei und verändert die Helligkeit in beide Richtungen um 30 und 15 Prozentpunkte, innerhalb des Bereichs von 10 bis 90 Prozent. Es gibt fünf Schattierungen und Tönungen als Hex-Codes zurück, mit deiner Basisfarbe in der Mitte. Ideal für Designer und Entwickler, die ruhige, konsistente UI-Farbskalen und Themes erstellen.
Häufig gestellte Fragen
Was gibt der monochromatische Farb-Generator zurück?
Er gibt fünf Farben als sechsstellige Hex-Codes in Kleinbuchstaben zurück. Farbe 3 ist deine Basisfarbe, die Farben 1 und 2 sind dunklere und die Farben 4 und 5 hellere Varianten desselben Farbtons.
Wie werden die Schattierungen berechnet?
Das Werkzeug wandelt deinen Hex-Code in HSL um und verändert nur die Helligkeit: um 30 und 15 Prozentpunkte verringern sowie um 15 und 30 Prozentpunkte erhöhen. Farbton und Sättigung bleiben gleich, sodass alle fünf Farben zu derselben Farbfamilie gehören.
Gibt es eine Unter- oder Obergrenze für die Helligkeit?
Ja. Die dunkleren Stufen fallen nie unter 10 Prozent Helligkeit und die helleren nie über 90 Prozent. So vermeidet die Skala reines Schwarz und reines Weiß.
Warum erhalte ich bei sehr dunklen oder sehr hellen Basisfarben doppelte oder unerwartete Farben?
Wegen der Grenzen von 10 und 90 Prozent fallen Stufen nahe den Enden auf denselben Wert. Bei #000000 werden die beiden dunkleren Stufen zu #1a1a1a, das heller als die Basisfarbe ist. Bei #ffffff sind die beiden helleren Stufen beide #e6e6e6.
Welche Palette ergibt reines Rot?
Für #ff0000 gibt das Werkzeug #660000, #b30000, #ff0000, #ff4d4d und #ff9999 zurück. Rot liegt bei 50 Prozent Helligkeit und erhält daher den gesamten Bereich mit zwei dunkleren und zwei helleren Stufen.
Welche Farbformate kann ich eingeben?
Gib einen 3- oder 6-stelligen Hex-Code ein, mit oder ohne #, zum Beispiel #3366cc oder 36c. Die Notationen RGB und HSL sowie Farbnamen werden nicht akzeptiert. Wandle sie daher zuerst in Hex um.
Warum hat sich meine Grundfarbe leicht verändert?
Farbton, Sättigung und Helligkeit werden auf ganze Zahlen gerundet. Daher kann sich beim Umwandeln in HSL und zurück ein Farbkanal um eine Stufe verschieben. #ff5733 erscheint zum Beispiel als #ff5833 in der Mitte der Skala.
Funktioniert das auch mit Grautönen?
Ja. Anders als bei farbtonbasierten Schemata verändert eine monochromatische Skala die Helligkeit, sodass ein Grauton hellere und dunklere Grautöne ergibt. Für Schwarz und Weiß gilt der oben beschriebene Bereich von 10 bis 90 Prozent.
Wie verwende ich eine monochromatische Palette in einer Benutzeroberfläche?
Verwende die dunkelsten Farben für Text und Rahmen, die Basisfarbe für primäre Aktionen und die hellsten für Hintergründe und Hover-Zustände. Prüfe den Textkontrast mit einem WCAG-Kontrastprüfer, da benachbarte Stufen nur 15 Prozentpunkte Helligkeitsunterschied haben.
Ist das Ergebnis dasselbe wie beim Farbpaletten-Generator?
Ja. Dieses Werkzeug verwendet genau die monochromatische Option des Farbpaletten-Generators. Daher geben beide Werkzeuge für dieselbe Basisfarbe dieselben fünf Hex-Codes zurück.