Elevation im Dark Mode: Heller heißt näher

Im Dark Mode wird Elevation über Helligkeit signalisiert statt über Schatten: Je höher eine Fläche liegt, desto heller wird sie. Der Seitenboden ist der dunkelste Wert im Theme; Karten, angehobene Elemente und Overlays werden darüber schrittweise heller, Dialoge am hellsten von allen. Das „Angehoben heißt Schatten darunter” aus dem Light Mode ist auf dunklem Grund kaum wahrnehmbar, also drehen Dark Themes den Kanal um — und dieser Wechsel macht aus Elevation statt einer Dekoration ein System: eine Leiter aus nahezu dunklen Flächenwerten, die genauso budgetiert, verteilt und geprüft werden muss wie jede andere Skala.

Dieser Artikel behandelt den Mechanismus — warum Schatten versagen, wie die Leiter in Zahlen aussieht und wo ihre Stufen anfangen, sich zu drängen. Er setzt den Rahmen unseres Dark-Mode-Leitfadens voraus. Ein Dark Theme ist eine abgeleitete Palette mit eigenen Regeln, kein umgefärbtes Light Theme.

Warum signalisieren Schatten auf dunklen Flächen keine Höhe?

Ein Schatten funktioniert, indem er dunkler ist als seine Umgebung. Auf einer weißen Seite ist enorm viel Raum unterhalb des Flächenwerts vorhanden — eine Karte am oberen Ende des Helligkeitsbereichs kann einen weichen grauen Schatten werfen, der mehrere Stufen dunkler ist, und das Auge liest den Unterschied sofort. Auf einer nahezu schwarzen Seite ist dieser Raum verschwunden: Der Grund liegt nahe am unteren Ende des Bereichs, und ein darauf geworfener Schatten ist Dunkel-auf-Dunkel — ein Signal mit kaum Raum zum Existieren. Der Schatten wird immer noch gezeichnet; er hat nur nichts zu sagen.

Also greifen Dark Themes auf den entgegengesetzten Kanal zurück. Die Konvention — populär gemacht durch Materials Elevation-System, das angehobene dunkle Flächen mit zunehmenden Mengen Weiß überlagert — lautet: Flächen werden heller, je höher sie steigen. Die physikalische Intuition trägt: In einem dunklen Raum fängt das, was näher an der Lichtquelle liegt, mehr davon ein. Heller liest sich als näher, und das Auge akzeptiert die Grammatik, ohne dass man sie ihm beibringen muss.

Wie sieht eine dunkle Elevation-Leiter in Zahlen aus?

Als System bedeutet der Wechsel, dass ein Dark Theme etwas braucht, das Light Themes fast umsonst aus Schatten bekommen: eine explizite Leiter aus Flächenwerten. Hier ist eine vierstufige Leiter, aufgebaut über einem markengetönten Anker — hauchzarte Chroma 0,02 im Farbton des Markenblaus #2563eb:

Die Arithmetik ist das Design. Vier Ebenen, die ≈ 0,12 Helligkeit überspannen, bedeuten drei Abstände von je ≈ 0,04 — bequem das Doppelte der Schwelle von ≈ 0,02, ab der zwei dunkle Flächen schwer auseinanderzuhalten sind. Jede Ebene ist von ihrer Nachbarin unterscheidbar, und der gesamte Stapel bleibt unterhalb des Punktes, an dem eine Fläche aufhört, als dunkel gelesen zu werden.

Öffne diese Leiter in Scale Composer — die vier Flächen-Ebenen über dem Anker gestapelt, mit dem Helligkeitsabstand zwischen jedem Paar, gemessen und gegen die Schwelle von 0,02 dargestellt.

Wie viele Elevation-Ebenen kann ein Dark Theme tragen?

Weniger, als dir lieb wäre, und die Arithmetik sagt, warum. Die Leiter lebt in einem schmalen Band: Sie beginnt am Seiten-Anker (≈ 0,13–0,18) und sollte enden, solange die oberste Fläche noch als dunkle Fläche gelesen wird und nicht als graue — in der Praxis nicht weit über L ≈ 0,3. Nenn die nutzbare Spanne ≈ 0,12.

Vier Ebenen in dieser Spanne ergaben Abstände von ≈ 0,04. Treib es auf sechs Ebenen, und dieselbe Spanne teilt sich in fünf Abstände von ≈ 0,024 — sie streifen den ≈ 0,02 gerade noch wahrnehmbaren Unterschied, den Punkt, an dem benachbarte Flächen zu Gleichheit verschwimmen und sich die Elevation-Geschichte nicht mehr erzählen lässt. Hier brauchen generierte dunkle Paletten Instrumentierung: Scale Composer warnt, wenn zwei Stufen innerhalb von 0,02 L beieinander landen, und ein dunkler Flächenstapel ist der häufigste Ort, an dem das ausgelöst wird.

Der verlockende Ausweg — die Spanne zu verbreitern, statt die Abstände zu verengen — tauscht ein Versagen gegen ein anderes: Ein Dialog bei L ≈ 0,35 hat eine saubere Trennung von allem darunter, tendiert aber dazu, sich wie ein hellgraues Panel zu lesen, das ein Dark Theme besucht, statt als die oberste Fläche des Themes selbst. Die ehrliche Schlussfolgerung ist, dass Elevation-Ebenen im Dark Mode ein Budget sind. Sie für Ebenen auszugeben, die Nutzer tatsächlich unterscheiden können, schlägt eine sechsstufige Leiter, die niemand lesen kann.

Haben Schatten und Rahmen noch eine Aufgabe?

Beide — der Wechsel stuft Schatten herab, er entlässt sie nicht.

Bei den höchsten Elevationen verdient sich ein weicher Schatten, gepaart mit der Helligkeitsstufe, weiterhin seinen Platz: Ein Dialog, der über einem vollen Layout schwebt, profitiert von einer Kante, die ihn von allem trennt, was er überlappt, und in dieser Höhe gibt es endlich etwas unter ihm, das hell genug ist, damit ein Schatten sich davon abhebt. Das zu vermeidende Muster sind Schatten statt Helligkeitsstufen, nicht Schatten zusätzlich zu ihnen.

Haarfeine Rahmen sind der andere legitime Hinweis. Ein ein Pixel breiter Rahmen mit einem leicht helleren Wert markiert eine Flächengrenze, ohne etwas vom Helligkeitsbudget auszugeben — flache Designsprachen setzen darauf, und er ist günstiger und schärfer als eine Leiterstufe, auf Kosten der Atmosphäre: Rahmen zeichnen eine Karte der Elevation, statt die Tiefe selbst zu erzeugen. Viele Dark Themes mischen beides — Leiterstufen für den Hauptstapel, Rahmen dort, wo Ebenen ineinander verschachtelt sein müssen.

Stresstest für deine eigene Leiter

Die Budget-Arithmetik überzeugt mehr, wenn es deine eigenen Flächen sind, die sich drängen. Treib eine dunkle Elevation-Leiter auf sechs Ebenen — füge Sprossen hinzu und beobachte, wie die Abstände Richtung Schwelle von 0,02 schrumpfen, bis die Warnung ausgelöst wird, und entscheide dann, wie viele Ebenen dein Theme tatsächlich braucht.