Schöne CSS-Boxschatten mühelos erstellen
Generieren Sie atemberaubende Box-Schatten mit unserer intuitiven Benutzeroberfläche. Kopieren Sie den CSS-Code und verwenden Sie ihn sofort in Ihren Projekten.
Preview
Box Shadow
Customize me
CSS Output
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
Shadow Controls
Position
Size
Color
Options
Presets
Weicher Schatten
Mittlerer Schatten
Schwerer Schatten
Innerer Schatten
Scharfer
Umriss Glühen
Doppelter Schatten
Lifted Effekt
Verwendung
von Basic Bedienelemente
- Passen Sie denhorizontalen Versatzan, um den Schatten nach links oder rechts
- Passen Sie denvertikalen Versatzan, um den Schatten nach oben oder unten
- Erhöhen Sie denUnschärferadius, um den Schatten weicher
- Use Breitenradiusum die Gesamtgröße des Schattens
- Ändern Sie die ,Color and Opacityum das Schattenerscheinungsbild
Erweiterte Funktionen
- Enable Schatten, um einen inneren Schatteneffekt
- Use Mehrere Schatten für komplexereEffekte
- Speichern und laden SiePresetsihn für den schnellen Zugriff auf Ihre Lieblingsschatten
- Click Zufälliger Schattenzur Inspiration
- Kopieren Sie den generierten CSS-Code und fügen Sie ihn in Ihr Projekt
Related Tools
CSS3-Transformationen mühelos erstellen
Ein leistungsstarkes, intuitives Tool zum Erstellen komplexer CSS3-Transformationen, ohne Code schreiben zu müssen. Visualisieren Sie Änderungen in Echtzeit und kopieren Sie das generierte CSS, um es in Ihren Projekten zu verwenden.
CSS3-Übergangsgenerator
Reibungsloser Übergang
Less-zu-CSS-Konverter
Wandeln Sie Ihren Less-Code in CSS um. Schnell, einfach und sicher.
CSS-zu-Stylus-Konverter
Wandeln Sie Ihren CSS-Code in die Stylus-Syntax um. Schnell, einfach und sicher.
Benutzerdefinierte Haftungsausschlüsse erstellen
CSS-Minimierer
Komprimieren und optimieren Sie Ihren CSS-Code mit professioneller Präzision