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.
Less-zu-CSS-Konverter
Wandeln Sie Ihren Less-Code in CSS um. Schnell, einfach und sicher.
Perfekte Flexbox-Layouts erstellen
Visualisieren, anpassen und generieren Sie CSS-Flexbox-Code mit unserer intuitiven Drag-and-Drop-Oberfläche.
CSS-Ribbon-Generator
Entwerfen Sie auffällige Bänder für Ihre Website
URL-Dekodierungstool
Dekodieren Sie URL-Parameter ganz einfach direkt in Ihrem Browser
CSV mühelos in JSON konvertieren
in Base64-Codierung Transformieren Sie Ihre CSV-Daten mit einem einzigen Klick in ein strukturiertes JSON-Format. Schnell, sicher und vollständig browserbasiert.