Generatore di Ombra CSS Box Shadow

Generatore gratuito online di ombra CSS con anteprima live. Regola offset, sfocatura, diffusione, colore e opacità con slider interattivi.

Shadow List
4px
4px
10px
0px
50%
Generated CSS

Come funziona

  1. Apri il generatore e visualizza immediatamente un'anteprima in tempo reale dell'ombra del box.
  2. Regola i cursori di spostamento orizzontale e verticale per posizionare l'ombra rispetto all'elemento.
  3. Imposta il raggio di sfocatura e la diffusione per controllare la morbidezza e la dimensione dell'ombra.
  4. Scegli il colore e l'opacità dell'ombra in base al tuo stile di design.
  5. Copia il codice CSS generato e incollalo direttamente nel tuo foglio di stile.

Esempio

Input: Orizzontale: 6px, Verticale: 12px, Sfocatura: 18px, Diffusione: 2px, Colore: #555555, Opacità: 0.6
Risultato: box-shadow: 6px 12px 18px 2px rgba(85, 85, 85, 0.6);

FAQ

Sì, il CSS Box Shadow Generator è completamente gratuito e non richiede registrazione o account.

I tuoi dati sono completamente al sicuro. Tutta l'elaborazione avviene lato client nel tuo browser. Nessun dato viene inviato a nessun server.

Sì, CSS supporta più valori di box-shadow separati da virgole per creare effetti di ombra stratificati.

Sì, la proprietà box-shadow è supportata da tutti i browser moderni senza bisogno di prefissi vendor.

Aggiungi la parola chiave 'inset' al valore di box-shadow per applicare l'ombra all'interno dell'elemento invece che all'esterno.