Generatore CSS box-shadow
box-shadow: 4px 4px 10px 0px rgba(0, 0, 0, 0.15);Drop Shadow
Ultimo aggiornamento: 2026 · Strumento online gratuito
Cos'è Generatore CSS box-shadow?
Generatore CSS box-shadow gratuito online con controlli per offset, sfocatura, diffusione, colore e inset, che offre un'anteprima dal vivo dell'ombra e produce codice CSS box-shadow pronto da copiare.
Come usare
- 1 Seleziona preset — Inizia rapidamente con un pulsante preset.
- 2 Regola cursori — Regola l'ombra con i cursori offset X/Y, sfocatura e diffusione.
- 3 Anteprima — Controlla il risultato in tempo reale nell'anteprima sopra.
- 4 Copia CSS — Usa il pulsante di copia per ottenere il CSS box-shadow.
Strumenti correlati
Generatore di gradiente CSS Generatore visivo gratuito di gradienti CSS: crea gradienti lineari, radiali e conici, regola i punti colore e l'angolo e copia il codice CSS pronto all'uso per gli sfondi.
Generatore CSS border-radius Generatore CSS border-radius gratuito online con otto maniglie d'angolo indipendenti e cursori, che offre un'anteprima dal vivo della forma arrotondata e produce codice CSS border-radius pronto da copiare.
Generatore CSS Flexbox Playground CSS Flexbox gratuito online con editor visuale per justify-content, align-items, flex-direction e wrap, che mostra un'anteprima dal vivo del layout e genera CSS Flexbox pronto da copiare.
Domande frequenti
Sì, usa il pulsante 'Aggiungi ombra' per sovrapporre più ombre.
Sì, attiva la casella Inset su ogni ombra per creare un'ombra interna.
Cinque preset sono forniti: Subtle, Medium, Large, Inset e Double.
Sì, puoi inserire direttamente rgba(0,0,0,0.15) nel campo colore.
No. Tutti i calcoli avvengono nel browser.