Vai al contenuto principale
SviluppatoreProcessado no seu navegador

Generatore Box Shadow CSS

Crea ombre CSS visivamente con anteprima in tempo reale.

0 di 3 utilizzi oggi · 3 rimanenti. Passa a Pro e rimuovi il limite.

Aggiorna
Livelli
1/6
Esporta
CSS3
Elaborazione
Elaborazione locale
01

Anteprima dal vivo

Risultato CSS
box-shadow: 0px 30px 60px -15px #4f46e566;
02

Livelli (1/6)

1
Offset X0px
Offset Y30px
Sfocatura60px
Diffusione-15px
Opacità40%

§ Come usare

Come generare un CSS box-shadow visivamente

Crea ombre di qualsiasi profondità (da sottili a drammatiche) con anteprima in tempo reale e codice pronto da copiare.

  1. Imposta gli offset

    X (orizzontale), Y (verticale), Blur (morbidezza) e Spread (spessore). Trascina i cursori per un feedback visivo immediato.

  2. Scegli il colore dell'ombra

    Il predefinito è nero a bassa opacità (un'ombra naturale). Per un 'bagliore' colorato, usa il colore del tuo brand.

  3. Sovrapponi più livelli (opzionale)

    Le ombre professionali usano 2-3 livelli (un'ombra ravvicinata più una diffusa). Sovrapponili per una profondità reale.

  4. Copia il CSS

    Pronto da incollare. Include un inset opzionale (ombra interna) e prefissi cross-browser.

Correlati

Strumenti correlati

Da mesma categoria.