CSS Box Shadow Generator
Kostenloser Online CSS Box Shadow Generator mit Live-Vorschau. Passen Sie Versatz, Unschärfe, Streuung, Farbe und Deckkraft an.
Shadow List
Generated CSS
So funktioniert es
- Öffnen Sie den Generator und sehen Sie sofort eine Live-Vorschau des Box-Shadows.
- Stellen Sie den horizontalen und vertikalen Versatz mit den Schiebereglern ein, um die Schattenposition zu bestimmen.
- Passen Sie Unschärfe und Ausbreitung an, um die Weichheit und Größe des Schattens zu steuern.
- Wählen Sie eine Farbe und Deckkraft passend zu Ihrem Design.
- Kopieren Sie den generierten CSS-Code und fügen Sie ihn direkt in Ihr Stylesheet ein.
Beispiel
Eingabe: Horizontal: 6px, Vertikal: 12px, Unschärfe: 20px, Ausbreitung: 3px, Farbe: #222222, Deckkraft: 0.7
Ergebnis: box-shadow: 6px 12px 20px 3px rgba(34, 34, 34, 0.7);
FAQ
Ja, der CSS Box Shadow Generator ist völlig kostenlos und erfordert keine Registrierung oder ein Konto.
Ihre Daten sind vollkommen sicher. Die gesamte Verarbeitung erfolgt clientseitig in Ihrem Browser. Es werden keine Daten an einen Server gesendet.
Ja, CSS unterstützt mehrere box-shadow-Werte, die durch Kommas getrennt sind. Kombinieren Sie einfach mehrere generierte Werte.
Ja, die box-shadow-Eigenschaft wird von allen modernen Browsern ohne Vendor-Präfixe unterstützt.
Ja, durch Hinzufügen des Schlüsselworts 'inset' zur box-shadow-Eigenschaft wird der Schatten nach innen angewendet.