CSS Box Shadow Generator

CSS Output

Was ist CSS Box Shadow?

Die CSS-Eigenschaft box-shadow fügt Schatteneffekte um den Rahmen eines Elements hinzu. Schatten können versetzt, unscharf gemacht, ausgebreitet, eingefärbt und als Inset (innerer Schatten) festgelegt werden. Mehrere durch Kommas getrennte Schatten können für reichhaltige Effekte gestapelt werden. Dieser Generator ermöglicht es Ihnen, komplexe mehrschichtige Schatten visuell zu erstellen und das fertige CSS in die Zwischenablage zu kopieren.

So verwenden Sie den Box Shadow Generator

Passen Sie die Regler für Offset X/Y, Blur und Spread an, um den Schatten zu positionieren und zu formen.
Klicken Sie auf das Farbfeld, um eine Schattenfarbe auszuwählen, und verwenden Sie den Opacity-Regler für Transparenz.
Schalten Sie 'Inset' ein, um einen inneren Schein oder einen gedrückten Effekt zu erstellen.
Klicken Sie auf '+ Ebene hinzufügen', um mehrere Schatten übereinander zu stapeln.
Kopieren Sie das generierte CSS und fügen Sie es in Ihr Stylesheet ein.

Keywords: CSS box shadow Generator, box-shadow CSS, CSS Schatten-Werkzeug, CSS drop shadow, innerer Schatten, mehrschichtiger Schatten, CSS shadow online