Alles läuft lokal in deinem Browser. Es wird nichts hochgeladen.

CSS-Schatten-Generator

Nutze dieses Werkzeug, um gestapelte CSS-Schatten mit Vorschau zu erstellen. Die Ergebnisse werden sofort aktualisiert und bleiben auf deinem Gerät.

Alles läuft lokal in deinem Browser. Es wird nichts hochgeladen.

Gestapelte CSS-Schatten erstellen

Element 1

Schattenvorschau

CSS-Schatten-Generator

Nutze dieses Werkzeug, um gestapelte CSS-Schatten mit Vorschau zu erstellen.

Die Verarbeitung erfolgt mit JavaScript im Browser, sodass du private Daten testen kannst, ohne sie an einen externen Dienst zu senden.

So verwendest du dieses Werkzeug

  1. Passen Sie den ersten Schatten an

    Legen Sie die Optionen X-Versatz, Y-Versatz, Unschärfe, Ausbreitung, Farbe, Alpha und inset fest.

  2. Stapeln Sie mehr Schatten

    Fügen Sie zusätzliche Schatten hinzu und ordnen Sie sie neu an, um mehrschichtige Tiefe zu erzeugen.

  3. Kopieren Sie den CSS

    Sehen Sie sich das Ergebnis in der Vorschau an und kopieren Sie die generierte box-shadow-Deklaration in Ihr Stylesheet.

FAQ

Lädt dieser Box-Schattengenerator etwas hoch?

Nein. Der CSS wird lokal in Ihrem Browser generiert.

Kann ich mehrere Schatten erstellen?

Ja. Fügen Sie gestapelte Schatten hinzu und ordnen Sie sie neu an, bevor Sie den endgültigen CSS kopieren.

Unterstützt es inset-Schatten?

Ja. Jeder Schatten hat seinen eigenen inset-Schalter.

Welchen CSS gibt es aus?

Die Ausgabe ist eine box-shadow-Deklaration, die in CSS eingefügt werden kann.