Box-Shadow-Generator
Kostenloser Online-CSS-box-shadow-Generator, Echtzeit-Vorschau
CSS box-shadow-Syntax
Die CSS-Eigenschaft box-shadow fuegt Schatteneffekte um ein Element hinzu. Syntax: box-shadow: [inset] offset-x offset-y blur spread farbe. Mehrere Schatten koennen durch Kommas getrennt werden. Verwenden Sie den visuellen Editor, um Werte anzupassen und das Ergebnis in Echtzeit zu sehen.
Den Box-Shadow-Generator verwenden
Passen Sie die Schieberegler fuer Offset X, Offset Y, Unschärfe-Radius und Ausbreitungs-Radius an. Waehlen Sie eine Schattenfarbe und schalten Sie die Inset-Option um. Der generierte CSS-Code wird in Echtzeit aktualisiert und kann in die Zwischenablage kopiert werden.
▶Was ist der Unterschied zwischen Unschaerfe und Ausbreitung?
Unschaerfe steuert, wie weich die Schattenkanten sind (0 = scharfe Kante, hoehere Werte = weicher). Ausbreitung vergroessert oder verkleinert den Schatten in alle Richtungen. Positive Ausbreitung macht den Schatten groesser als das Element.
▶Kann ich mehrere Schatten hinzufuegen?
Ja, CSS unterstuetzt mehrere Schatten, durch Kommas getrennt. Kombinieren Sie subtile Schatten fuer einen realistischeren Tiefeneffekt.
▶Was bewirkt ein Inset-Schatten?
Ein Inset-Schatten erscheint innerhalb des Elements statt ausserhalb. Er erzeugt den Eindruck, dass das Element nach innen gedrueckt ist, wie ein Textfeld oder eine Schaltflaeche.