48Hausfarben
sechs Gruppen · jeder auf hell und dunkel geprüft4in einem Fenster
Palette · Rad · Verlauf · Favoriten- Farbton
- 0–360°
- Sättigung
- 0–100
- Helligkeit
- 0–100
- Deckkraft
- 0–1
320pt 220pt 84,5
Fensterbreite · Durchmesser des Rades · Beginn des Lochs24Farben im Verlauf
dazu Favoriten — beides im Browser, nichts auf einem ServerAerona Farben
Ein Farbsystem, das in jeder App, im Betriebssystem und auf dieser Seite dasselbe ist. Was es kann, steht hier auf einer Tafel.
Lesbarkeit nach WCAG
gegen Weiß und Schwarz, während man ziehtVier Harmonien
180° · 30° · 120° · 150/210°Live-Farbanpassung
Rechtsklick auf jedes Element — oder zwei Sekunden haltenJeder Buchstabe einzeln
ein Wort, so viele Farben wie Zeichen- Ziel 2,0, wenn es für Schrift nicht reicht
- In Schritten von fünf, höchstens zwanzig
- Nur die Helligkeit wandert — Farbton und Sättigung bleiben
10Gruppen 9Sprachen
„rot", „red", „rojo" — oder eine Zeichenfolge mit RauteDieselbe Rechnung wie in den Apps
306.288
Vergleiche über den ganzen Farbraum — kein einziger UnterschiedAlle Zahlen sind aus dem Programm gelesen, nicht gerundet: Fensterbreite, Maße des Rades und die Winkel der Harmonien stehen so im Code der Apps. Die Lesbarkeitswerte folgen den Web-Richtlinien (WCAG 2.1). Verlauf und Favoriten liegen ausschließlich in deinem Browser und werden nirgends hingeschickt; auf dieser Seite tragen sie eigene Namen, damit das Ausprobieren nichts an den Apps verstellt. Die stille Korrektur greift nur, wenn eine Farbe als Schrift verwendet wird. Die Live-Farbanpassung gibt es in den Apps, nicht auf dieser Seite — hier ist sie nachgestellt. Farbnamen werden in neun Sprachen erkannt; die Apps selbst sprechen 85.
Das Farbrad
In jeder Aerona-App steckt derselbe Farbwähler. Wer dort eine Fläche, eine Schrift oder einen Rand umfärbt, bekommt dieses Fenster zu sehen — und nicht das eingebaute Kästchen des Betriebssystems, das auf jedem Gerät anders aussieht und anders bedient wird.
Was hier steht, ist keine Nachbildung. Es ist dasselbe Bauteil: dieselben vier Ansichten, dieselben Maße, dieselben Farben, dieselbe Rechnung. Das Fenster ist 320 Punkte breit, das Rad 220 im Durchmesser, das Loch darin beginnt bei 84,5 — jede dieser Zahlen steht so im Programm.
Probier alles aus. Nichts davon verändert etwas an deinen Einstellungen; was du hier mischst, bleibt in diesem Browser und geht die Apps nichts an.
Vier Ansichten, ein Fenster
Rechtsklick auf eine Farbe im Verlauf — oder gedrückt halten —, um sie zu merken.
Oben stehen vier Reiter. Palette zeigt 48 vorbereitete Töne, Rad mischt frei, Verlauf baut einen Übergang aus drei Farben, Favoriten sammelt, was man behalten will. Darunter liegt ein Streifen mit den zuletzt benutzten Farben — er füllt sich, sobald du etwas wählst.
Der bunte Ring ist der Farbton — Rot, Gelb, Grün, Türkis, Blau, Magenta und zurück zu Rot. Er ist ein Ring und keine Leiste, weil Farbton rundläuft: Nach Magenta kommt wieder Rot, ohne Sprung. Eine Leiste hätte an dieser Stelle ein Ende, das es in Wahrheit nicht gibt.
Das Quadrat in der Mitte trägt zwei Angaben auf einmal: nach rechts wird die Farbe kräftiger (Sättigung), nach oben heller (Helligkeit). Deshalb ist es ein Quadrat und kein Regler — zwei Werte, ein Griff. Das Loch im Ring hat einen Grund: Wer das Quadrat antippt, soll nicht versehentlich den Farbton verstellen.
Darunter liegen dieselben Angaben noch einmal als Leisten, für alle, die lieber schieben als zielen: Helligkeit, Farbton, Deckkraft. Das Schachbrettmuster der untersten Leiste ist kein Schmuck — daran erkennt man, wo die Farbe durchsichtig wird. Ohne Muster sähe halb durchsichtiges Weiß auf hellem Grund aus wie ganz deckendes Weiß.
Die vier Zahlenfelder darunter sind Rot, Grün, Blau und Deckkraft — zum Eintippen, wenn ein Wert schon feststeht. Daneben das Feld für die Zeichenfolge, wie sie im Netz üblich ist. Beide Wege gehen in beide Richtungen: Was du oben ziehst, steht unten sofort als Zahl.
Der innere Kreis zeigt immer, was gerade eingestellt ist. Er ist absichtlich groß: Kleine Farbtupfer täuschen. Dieselbe Farbe wirkt auf großer Fläche anders als auf einem Punkt von acht Pixeln.
Vier Wege zur selben Farbe
Es gibt nicht den einen richtigen Weg, eine Farbe zu wählen. Wer schnell etwas Passendes braucht, greift zur Palette. Wer eine bestimmte Farbe im Kopf hat, mischt sie im Rad. Wer schon weiß, was er will, tippt die Zeichenfolge ein. Deshalb liegt alles in einem Fenster nebeneinander statt in vier Menüs.
Palette
48 Töne, fünf je Reihe, in sechs Gruppen sortiert: Blau und Wasser, Grün und Natur, Gelb und Orange, Rot, Pink und Violett, Metall und Neutral. Sie sind nicht zufällig, sondern ausgesucht — jeder funktioniert auf dunklem wie auf hellem Grund. Die gewählte Farbe steht mit hellem Rand da und ist etwas größer.
Rad
Der freie Weg. Ring, Quadrat, drei Leisten, Zahlen, Zeichenfolge — dazu Pipette und Kopieren. Die Pipette gibt es nur in manchen Browsern; wo sie fehlt, ist der Knopf ausgeblendet statt tot.
Verlauf
Drei Farben und ein Winkel ergeben einen Übergang. Ein Klick auf eines der drei Felder sagt, welche Stützstelle du gerade mischst; das Rad bleibt darunter stehen. Die runde Scheibe dreht den Winkel — und zeigt ihn in Grad, damit man ihn wiederfindet.
Favoriten
Was man behalten will. Rechtsklick auf eine Farbe im Verlaufsstreifen — oder gedrückt halten, für alle ohne rechte Maustaste — legt sie hier ab. Ein kleines Herz an der Ecke zeigt, welche schon dabei sind.
Was du schon benutzt hast
Unter den Reitern liegt ein schmaler Streifen mit den zuletzt gewählten Farben. Er merkt sich bis zu 24 Stück, die neueste ganz links. Eine Farbe kommt erst hinein, wenn du die Maus loslässt — nicht bei jedem Zwischenschritt. Sonst stünden dort hundert fast gleiche Töne, durch die niemand mehr durchsieht.
Drei kleine Knöpfe gehören dazu: die Lupe blendet ein Suchfeld ein, mit dem man nach einem Farbwert sucht; der Pfeil klappt den Streifen zu einem Feld auf, wenn seitliches Schieben lästig wird; der Papierkorb leert ihn — mit einer Rückfrage, weil das nicht rückgängig zu machen ist.
Verlauf und Favoriten liegen in deinem Browser, nicht auf einem Server. Sie werden nirgends hingeschickt. Auf dieser Seite tragen sie eigene Namen, damit das Herumprobieren hier nichts an den Apps verstellt.
Eine hübsche Farbe, die niemand lesen kann, ist keine
Unter dem Rad stehen zwei kleine Kästchen mit einem Aa darin — einmal in Weiß, einmal in Schwarz, beide auf der gerade gewählten Farbe. Daneben eine Zahl und ein Kürzel. Die Zahl ist das Verhältnis der Helligkeiten zwischen Schrift und Grund, gerechnet nach der Formel der Web-Richtlinien: Reines Weiß auf reinem Schwarz ergibt 21, zwei gleiche Farben ergeben 1.
Diese Prüfung läuft mit, während man zieht. Nicht hinterher, nicht auf Knopfdruck. Wer eine Farbe wählt, sieht im selben Augenblick, ob Text darauf noch lesbar ist — und das ist der einzige Zeitpunkt, an dem die Auskunft etwas nützt.
Beide Kästchen stehen nebeneinander, weil es keine Farbe gibt, die für sich gut oder schlecht ist. Ein sattes Blau kann für weiße Schrift genügen und für schwarze versagen. Erst wenn man weiß, was darauf stehen soll, lässt sich das entscheiden.
Farben, die zur gewählten passen
Ganz unten liegen vier Streifen. Sie sind nicht ausgedacht, sondern gerechnet: Jeder dreht den Farbton um einen festen Winkel weiter und lässt Sättigung, Helligkeit und Deckkraft, wie sie sind. Ein Klick auf ein Feld übernimmt die Farbe.
Komplementär
Der Gegenpol, 180 Grad weiter. Der stärkste Gegensatz, den es gibt — gut für das eine Element, das auffallen soll, und schlecht für alles daneben.
Analog
Die zwei Nachbarn, je 30 Grad. Sie streiten nicht miteinander — das ist der ruhige Vorschlag, wenn eine Fläche größer wird.
Triadisch
Drei Farben im gleichen Abstand, je 120 Grad. Lebendig, ohne dass eine die anderen erschlägt.
Gespalten
150 und 210 Grad — die beiden Nachbarn des Gegenpols. Fast so deutlich wie komplementär, aber nicht so hart.
Jedes System hat ein eigenes Kästchen
Browser und Betriebssysteme bringen einen Farbwähler mit. Er ist auf jedem System ein anderer: unter Windows anders als unter macOS, im Handy-Browser wieder anders. Man kann ihm nichts beibringen — keine Deckkraft, keine Lesbarkeitsprüfung, keine Harmonien, keine Favoriten. Und er sieht nie aus wie die App, in der er aufgeht.
Deshalb ein eigenes. Es kostet mehr Arbeit und ein paar Kilobyte, und dafür ist es überall dasselbe — in den Apps, im Betriebssystem und hier auf dieser Seite. Bis hin zum Grundton des Fensters: #1e293b, 16 Punkte runde Ecken, 20 Punkte Innenabstand.
Das war der erste Teil. In den nächsten geht es um die Aerona-Hausfarben, um das helle und das dunkle Erscheinungsbild und darum, wie man in den Apps eigene Farben setzt.