Form · T-10
Schatten erstellen
Ein einzelner Schatten sieht oft aus wie ein grauer Fleck. Kleurstaal stapelt mehrere, jeder doppelt so weit und so weich, so wie echtes Licht fällt. Sie sehen sofort, wie es auf Hell und auf Dunkel wirkt.
Ihre Dateien bleiben auf Ihrem Gerät
Fragen
Gut zu wissen
Warum mehrere Schichten?
Echte Schatten sind nah am Gegenstand scharf und werden weiter weg unscharf. Ein paar Schichten, jede doppelt so weit und weich, ahmen das nach. Eine einzelne Schicht wirkt flach.
Warum Schatten statt Rändern?
Ein Schatten zeigt, was über der Seite liegt und was in sie eingedrückt ist, ohne Linien, die das Bild unruhiger machen. So funktionieren alle Websites von nealvdv: angehoben zum Klicken, eingedrückt, wo Sie tippen.
Reicht ein Schatten, um eine Schaltfläche zu erkennen?
Nicht immer. Für die Barrierefreiheit muss eine Schaltfläche auch ohne Schatten erkennbar sein, durch ihren Text, ihre Form oder ihre Farbe. Nutzen Sie den Schatten als Zusatz, nicht als einziges Zeichen.
So funktioniert es
Schatten erstellen in drei Schritten
Mit einer Voreinstellung beginnen
Weich, schwebend, angehoben oder eingedrückt. Oder stellen Sie Abstand, Unschärfe und Stärke selbst ein.
Hell und Dunkel ansehen
Links eine helle Seite, rechts eine dunkle. Auf Dunkel wird der Schatten schwarz und stärker, sonst sehen Sie ihn nicht.
CSS kopieren
Als Variable, mit einer dunklen Version für alle, die den dunklen Modus nutzen.