A cura di FreeWebTools Editorial Team Aggiornato il 23 agosto 2026

🔲

Generatore Box Shadow

Crea effetti ombra CSS visivamente con controlli intuitivi. Regola blur, spread, colore e offset. Copia il codice CSS pronto per l'uso.

Anteprima

Livelli ()

Preset

Layer

Offset orizzontale: px

Offset verticale: px

Raggio sfocatura: px

Raggio espansione: px

Colore ombra

Opacità: %

Interno

Codice CSS

Incorpora questo strumento nel tuo sito

× px

Tema

Colore

Sfondo

Bordo

Colore del bordo

Raggio bordo

Mostra branding Consenti schermo intero Modalità compatta Attiva animazioni Sfondo trasparente

👁️ Anteprima

💡 Suggerimento per l'integrazione

Copia il codice di incorporamento e incollalo nell'HTML del tuo sito web. La versione responsive si adatta automaticamente a tutte le dimensioni dello schermo.

0 valutazioni

Valuta questo strumento

✓

Informazioni su Generatore Box Shadow

Progetta ombre CSS con editor visivo. Regola sfocatura, diffusione, offset e colore.

Casi d'uso

Aggiungere profondità a card e contenitori

Creare effetti hover sui pulsanti

Progettare elementi UI moderni

Far risaltare elementi dallo sfondo

Sperimentare con stili di ombra

Come usare

Regola offset orizzontale e verticale

Imposta raggio sfocatura e diffusione

Scegli colore e opacità ombra

Copia il codice CSS generato

Suggerimenti Pro

Ombre sottili sembrano più naturali (bassa opacità, sfocatura leggera)
Usa ombre multiple per profondità
Ombre inset creano effetti premuti

Domande frequenti

Spread espande o contrae la dimensione ombra oltre l elemento.

Quanto morbidi o duri appaiono i bordi. Più alto = più morbido.

Si! Impila valori box-shadow multipli separati da virgole.

Strumenti popolari

Nessun altro strumento

Esplora tutti gli strumenti