Zufallsfarben-Generator

Was „zufällige Farbe“ wirklich bedeutet

Eine Bildschirmfarbe besteht aus drei Bytes – Rot, Grün und Blau, jeweils 0–255 –, der Raum möglicher Farben umfasst also 256 × 256 × 256 = 16.777.216 Codes. Der Modus „Beliebige Farbe“ zieht gleichverteilt aus diesem Raum: Jeder einzelne der 16,7 Millionen Codes hat bei jedem Klick exakt dieselbe Chance von 1 zu 16.777.216. Die Ziehung stammt von crypto.getRandomValues(), der kryptografischen Zufallsquelle des Browsers – demselben Generator, der auch Schlüssel und Tokens erzeugt – und die Abbildung von rohen Zufallsbits auf eine Farbe ist exakt verzerrungsfrei, denn 2³² ist ein ganzzahliges Vielfaches von 2²⁴: Keine Farbe ist auch nur mikroskopisch wahrscheinlicher als eine andere.

Warum echt zufällige Farben so oft matschig aussehen

Klicke ein Dutzend Mal auf „Beliebige Farbe“, und du triffst weit häufiger auf Senfgelb, Schiefergrau, trübes Oliv und bräunliches Pflaumenrot als auf ein knalliges Feuerwehrrot. Das ist kein Fehler des Generators – es ist Geometrie. Die kräftigen, benennbaren Farben, die uns bei „zufällige Farbe“ in den Sinn kommen, sitzen an den Ecken und Kanten des RGB-Würfels: Reines Rot ist eine einzige Ecke unter 16,7 Millionen Punkten, und selbst seine unmittelbare Nachbarschaft ist winzig. Das Innere des Würfels – der überwältigende Großteil seines Volumens – besteht aus Mischungen, in denen alle drei Kanäle mittelstark belegt sind, und genau das Mischen aller drei Grundfarben ist das Rezept für graustichige, bräunliche, gedämpfte Farben.

Wahrnehmungsbasierte Farbräume machen dieses Ungleichgewicht messbar: In OKLCH umgerechnet liegt der Großteil des Würfelvolumens bei geringer bis mittlerer Buntheit, während eine Buntheit, die hoch genug ist, um als „kräftig“ wahrgenommen zu werden, nur eine dünne Schale nahe der Oberfläche des Farbraums einnimmt. Gleichverteiltes Ziehen nach Volumen landet deshalb meistens im gedämpften Inneren. Die menschliche Erwartung ist genau andersherum verzerrt – die „zufällige Farbe“ im Kopf stammt aus Buntstiftschachteln und Markenpaletten, die fast ausschließlich Farben von dieser Oberfläche enthalten. Gleichverteilter Zufall ist fair; er ist nur nicht dekorativ.

Wie der Modus „Angenehm“ vorzeigbar bleibt

Der Modus „Angenehm“ tauscht Gleichverteilung über alle Farben gegen Gleichverteilung über brauchbare Farben. Statt in RGB wird in OKLCH gezogen, einem wahrnehmungsgleichmäßigen Raum, dessen Achsen halten, was sie versprechen: Die Helligkeit wird zwischen 0,55 und 0,8 gezogen (hell genug, um freundlich zu wirken, dunkel genug, um Substanz zu behalten), die Buntheit zwischen 0,08 und 0,2 (deutlich farbig, nie neon), und der Farbton bleibt über den vollen Kreis von 0–360° völlig frei. Weil diese Grenzen wahrnehmungsbezogen und nicht numerisch-RGB sind, kommt jeder Farbton mit vergleichbarem visuellem Gewicht an – ein „angenehmes“ Petrol und ein „angenehmes“ Rosa wirken tatsächlich wie Geschwister.

Eine Feinheit: Nicht jede OKLCH-Kombination existiert auf einem sRGB-Bildschirm – manche Paare aus Helligkeit und Buntheit sprengen bei bestimmten Farbtönen den Farbraum. Passiert das, wird die Farbe so in den Farbraum abgebildet, wie es CSS Color 4 vorschreibt: Farbton und Helligkeit bleiben fest, während die Buntheit per binärer Suche so weit gesenkt wird, bis die Farbe gerade hineinpasst. Der Charakter der Ziehung bleibt erhalten; nur unmögliche Kräftigkeit wird gekappt.

Wo eine Zufallsfarbe wirklich nützlich ist

• Platzhalter und Avatare – Nutzern, Tags oder Diagrammreihen unterscheidbare Farben zuweisen, ohne vorher eine Farbpalette entwerfen zu müssen.
• Generative Kunst – eine Startfarbe auswürfeln und darauf aufbauen; der Modus „Angenehm“ hält die Startwerte im brauchbaren Bereich.
• Code testen, der Farben verarbeitet – Parser, Konverter und Kontrast-Pipelines mit beliebigen Eingaben fuzzen, statt immer mit denselben drei handverlesenen HEX-Codes.
• Faire Auslosungen – Teamfarben bestimmen oder Seiten zuteilen, ohne dass jemand das Ergebnis manipulieren kann.

Ein Hinweis zu Fairness und Wiederholungen

Math.random(), der JavaScript-Standard, taugt für Animationen, ist aber nicht darauf ausgelegt, unvorhersehbar zu sein. Diese Seite nutzt stattdessen den kryptografisch sicheren Generator: Die Folge lässt sich weder vorhersagen noch reproduzieren – und genau das macht eine Farbziehung wirklich fair, wenn etwas davon abhängt, und sei es nur die Ehre. Wiederholungen sind dagegen ganz normal: Die Ziehungen sind unabhängig, dieselbe Farbe kann also zweimal auftauchen, und der Geburtstagseffekt macht die erste Wiederholung wahrscheinlicher, als die Intuition vermutet – rund 4.800 Ziehungen genügen für eine Chance von 50 %, dass sich unter den 16,7 Millionen Farben irgendeine wiederholt.

Verlauf, damit ein guter Treffer nie verloren geht

Die Leiste unter dem Generator bewahrt deine letzten 20 Ziehungen auf und übersteht auch das Neuladen der Seite (sie wird lokal auf deinem Gerät gespeichert). Klicke auf ein beliebiges Feld, um die Farbe zurückzuholen, wäge mehrere Kandidaten gegeneinander ab und kopiere dann den Sieger oder speichere ihn in „Meine Farben“. Es gibt sie, weil die beste Zufallsfarbe immer die ist, an der du drei Ziehungen zuvor vorbeigeklickt hast.

Alles läuft zu 100 % in deinem Browser – kein Server erfährt je, welche Farben du gezogen hast. Taucht ein vielversprechender Kandidat auf, gib ihn weiter: Prüfe ihn im Kontrast-Checker als Text- oder Hintergrundfarbe oder stelle mehrere Ziehungen im Tool „Farben vergleichen“ nebeneinander.