CSS box-shadow-generator
box-shadow: 4px 4px 10px 0px rgba(0, 0, 0, 0.15);Drop Shadow
Senast uppdaterad: 2026 · Gratis onlineverktyg
Vad är CSS box-shadow-generator?
Gratis visuell onlineredigerare för att skapa CSS box-shadow och kopiera koden
Så använder du
- 1 Välj förinställning — Börja snabbt med en förinställningsknapp.
- 2 Justera reglage — Justera skuggan med X/Y-förskjutning, oskärpa och spridningsreglage.
- 3 Förhandsgranska — Kontrollera resultatet i realtid i förhandsgranskningen ovan.
- 4 Kopiera CSS — Använd kopieringsknappen för att hämta box-shadow CSS.
Relaterade verktyg
Vanliga frågor
Ja, använd knappen 'Lägg till skugga' för att lägga flera skuggor ovanpå varandra.
Ja, aktivera Inset-kryssrutan på varje skugga för att skapa en inre skugga.
Fem förinställningar erbjuds: Subtle, Medium, Large, Inset och Double.
Ja, du kan ange rgba(0,0,0,0.15) direkt i färginmatningsfältet.
Nej. Alla beräkningar sker i webbläsaren.