toolbin_

CSS box-shadow Generator

Generieren Sie einen CSS box-shadow mit Live-Vorschau und kopierfertigem Code.

🔒 100 % clientseitig — keine Daten gesendet

Generieren Sie einen CSS box-shadow mit Live-Vorschau und übernehmen Sie den kopierfertigen Code für Ihr Projekt. Stimmen Sie Versatz, Unschärfe, Ausbreitung, Farbe und inset ab, um saubere Tiefeneffekte zu gestalten. Alles wird in Ihrem Browser berechnet, ohne Registrierung und ohne Datenübertragung.

FAQ

Wie funktioniert die Eigenschaft box-shadow?

box-shadow verwendet einen horizontalen und vertikalen Versatz, einen Unschärferadius, eine Ausbreitung und eine Farbe, zum Beispiel: box-shadow: 4px 4px 10px 0 rgba(0,0,0,0.2);

Wie erstelle ich einen inneren Schatten (inset)?

Fügen Sie das Schlüsselwort inset vor den Schattenwerten hinzu, damit der Schatten im Element statt außerhalb gezeichnet wird.

Kann ich mehrere Schatten auf ein Element anwenden?

Ja, trennen Sie die einzelnen Schatten einfach mit Kommas in derselben box-shadow Deklaration, um sie zu überlagern.

Was ist der Unterschied zwischen blur und spread?

Blur macht die Kanten des Schattens weicher, während spread seine Größe vergrößert oder verkleinert, bevor die Unschärfe angewendet wird.