CSS-Box-Shadow-Generator
Um einen CSS-Schatten zu erstellen, stellen Sie Versatz, Unschärfe, Ausbreitung, Farbe und Deckkraft ein, fügen für realistische Tiefe weitere Ebenen hinzu, schalten optional inset ein und kopieren das box-shadow-CSS. Die Vorschau aktualisiert sich live.
- Kostenlos
- Ohne Anmeldung
- Läuft in Ihrem Browser
CSS-Box-Shadow-Generator: so funktioniert es
- 1Geben Sie Ihren Text in das Tool ein oder fügen Sie ihn ein.
- 2Wählen Sie die gewünschten Optionen.
- 3Das Ergebnis aktualisiert sich sofort.
- 4Kopieren oder laden Sie das Ergebnis herunter.
CSS-Box-Shadow-Generator: häufige Fragen
Wie erstelle ich einen weichen, realistischen Schatten?
Stapeln Sie zwei oder drei Schatten mit zunehmender Unschärfe und geringer Deckkraft, etwa 0 1px 2px und 0 8px 24px mit 10–15 % Deckkraft.
Beeinflusst box-shadow das Layout?
Nein. Schatten werden außerhalb der Box gezeichnet und verschieben nie andere Elemente.
Werden meine Daten beim Tool „CSS-Box-Shadow-Generator“ hochgeladen?
Nein. Das Tool „CSS-Box-Shadow-Generator“ läuft vollständig in Ihrem Browser, Ihre Texte und Zahlen bleiben also auf Ihrem Gerät, und es funktioniert auch bei langsamer Verbindung.
Funktioniert das Tool „CSS-Box-Shadow-Generator“ auf iPhone, Android und Mac?
Ja. Das Tool „CSS-Box-Shadow-Generator“ läuft in jedem aktuellen Browser (Safari, Chrome, Edge oder Firefox) auf iPhone, iPad, Android-Smartphones, Mac, Windows und Chromebook. Es muss keine App installiert werden.
Ist das Tool „CSS-Box-Shadow-Generator“ kostenlos?
Ja. Das Tool „CSS-Box-Shadow-Generator“ ist kostenlos, ohne Anmeldung, ohne Wasserzeichen und ohne Tageslimit.