Farbe & Design
Box-Shadow-Generator
Kostenloser CSS-Box-Shadow-Generator. Gestalten Sie Schatten mit Schiebereglern für Versatz, Weichheit, Ausbreitung, Farbe und Deckkraft. Schichten Sie mehrere Schatten. Kopieren Sie CSS sofort.
Runs in your browser
Box shadow generator
CSS
box-shadow: 0px 10px 30px -10px rgba(59, 130, 246, 0.40);css
Anmerkung der Redaktion
Understanding · Five numbers. A whole light source.
Dieses ausführliche Kapitel ist derzeit nur auf Englisch verfügbar. Das Konvertierungstool oben funktioniert in Ihrer Sprache; der lange Erklärtext wurde noch nicht übersetzt.
Häufig gestellte Fragen
Quick answers.
›Can I layer multiple shadows?
Yes — add as many shadows as you want, each with its own offset, blur, spread and color.
›Does it support inset shadows?
Yes — toggle 'inset' to make a shadow appear inside the element instead of outside.
›Does it output Tailwind?
Yes — for common single-shadow patterns. Multi-shadow stacks need custom CSS.
›Is the generator free?
Yes — fully free, no signup.
Andere suchten auch nach
Verwandte Tools
More in this room.
- Erweiterter Box-Shadow-EditorMehrere Schatten stapeln mit Live-Vorschau.
- Farbverlauf-GeneratorLineare, radiale und konische CSS-Farbverläufe.
- Border-Radius-GeneratorEckenspezifischer CSS-Border-Radius-Editor.
- Cubic-Bezier-EditorVisuelles Design von CSS-Easing-Kurven.
- CSS AnimationsgeneratorKeyframes visuell erstellen, gebrauchsfertiges CSS kopieren.
- CSS Filter GeneratorLive-Vorschau von Unschärfe, Helligkeit, Farbtondrehung und mehr.