Generatore di ombre CSS
Sovrapponi fino a 8 livelli di box-shadow con spostamento, sfocatura, diffusione, colore e inset, vedi l’anteprima e copia il CSS.
- Funziona nel browser
- Nessun caricamento
- Il risultato resta sul tuo dispositivo
Privacy e limitiFunziona nel tuo browser. Nulla viene caricato.
Il contenuto degli input resta in questa scheda; Refentra non lo carica né lo memorizza. I conteggi aggregati facoltativi delle azioni vengono inviati solo con il tuo consenso alla misurazione dell’uso. Svuota l’area di lavoro al termine.
Profilo supportato: 1–8 livelli px modificabili, inset e alpha 0–1; sfocatura non negativa.
Massimo 200.000 unità UTF-16; i parser possono avere limiti inferiori. Worker: 15 secondi (regex 1,5 secondi).
Controlla i dati e il risultato
- Prepara e scegli l’operazione
Imposta per ogni livello gli scostamenti orizzontale e verticale, la sfocatura, l’espansione, il colore e l’alfa; attiva inset per le ombre interne.
- Verifica un esempio concreto
Prova questo esempio e confronta il risultato indicato: x=0 y=4 blur=8 spread=0 color=#000000 alpha=0.25 → 0px 4px 8px 0px rgba(0, 0, 0, 0.25)
- Controlla prima di riutilizzare l’output
Guarda l’ombra composta su uno sfondo a contrasto; più livelli sono separati da virgole e mantengono il loro ordine.
Risposte per questa operazione
Perché un’ombra può sparire dopo averla copiata?
Un elemento antenato con ritaglio o overflow può tagliarla; anche un alfa 0 o uno sfondo uguale possono nascondere un’ombra altrimenti valida.
Che cosa controllo se i dati vengono rifiutati?
Fornisci da 1 a 8 livelli validi; la sfocatura non può essere negativa e l’alfa deve essere compreso tra 0 e 1. Scostamenti ed espansione possono essere negativi.
Dove si ferma questo strumento?
L’output applica lo stile al riquadro dell’elemento; non genera text-shadow né segue il contorno opaco di un’immagine trasparente.