Daily Toolkits

Box Shadow Generator

Designa lådskuggor i lager med offset, oskärpa, spridning och färg. Förhandsgranska på ett kort och kopiera sedan CSS med ett klick.

Box Shadow Generator

Live
Preview card

CSS output

box-shadow: 8px 16px 32px -4px rgba(192, 38, 211, 0.35);
border-radius: 24px;

Key capabilities

  • Designa skiktade box-skuggor med offset, oskärpa, spridning och färg – liveförhandsvisning ingår.
  • Körs i din webbläsare
  • Gratis att använda

Så använder du

  1. Justera offset, oskärpa och spridning.
  2. Välj färg och opacitet (eller lägg till lager).
  3. Kopiera box-shadow CSS.

How this tool works

  1. Justera offset, oskärpa och spridning.
  2. Välj färg och opacitet (eller lägg till lager).
  3. Kopiera box-shadow CSS.

Recommended settings

  • Använd först standardalternativen och justera sedan om det behövs

Supported formats

Text / on-page input

File size and limits

  • Mycket komplexa förhandsvisningar i flera lager kan kännas långsammare på äldre telefoner.

Privacy

Färg- och CSS-generatorer körs helt i din webbläsare. Förhandsvisningar och konverteringar laddar aldrig upp dina stilar.

Common use cases

  • Använd Box Shadow Generator när du behöver: Designa skiktade box-skuggor med offset, oskärpa, spridning och färg – liveförhandsvisning ingår.

Troubleshooting

Förhandsgranskningen ser annorlunda ut efter inklistring

Kontrollera om det finns konkurrerande CSS på din sida (återställningar, ärvda färger). Kopiera den genererade regeln till en isolerad stilmall först.

FAQ

Laddar detta upp min CSS?

Nej. Generatorer och omvandlare körs i din webbläsare med liveförhandsvisning.

Behöver jag ett konto?

Nej. Öppna verktyget, justera kontrollerna och kopiera CSS.

Relaterade verktyg

Text Shadow Generator

Craft readable text-shadow styles with live typography preview.

Open tool

Border Radius Generator

Control each corner independently and preview rounded shapes with copy-ready CSS.

Open tool

CSS Gradient Generator

Build linear, radial, and conic gradients with live preview and copy-ready CSS.

Open tool