# Progetta ombre CSS visivamente invece di indovinare i valori
Regolare box-shadow a mano è noioso. Questo generatore ti permette di impilare più ombre, vederle in diretta e copiare CSS pronto per la produzione. 5 Strati ombra per elemento
Live Anteprima ad ogni modifica
5 Preset rapidi
# Sovrapponi più ombre per profondità realistica
Le ombre reali non sono mai un blur uniforme. Sovrapporre un'ombra stretta vicino all'elemento con una più morbida e ampia crea profondità naturale. Usa + per aggiungere strati.# Capire ogni controllo
| Controllo | Valore CSS | Effetto |
|---|---|---|
| Offset X | 1a lunghezza | Spostamento orizzontale. |
| Offset Y | 2a lunghezza | Spostamento verticale. |
| Sfocatura | 3a lunghezza | Raggio di blur. |
| Espansione | 4a lunghezza | Allarga o restringe l'ombra. |
| Colore & Opacità | rgba() | Colore ombra con opacità indipendente. |
| Interno | inset | Ombra dentro il bordo dell'elemento. |
Usa una griglia di sfondo discreta
L'anteprima mostra una griglia a punti per vedere quanto si estende l'ombra. Usa uno spread negativo per mantenerla più vicina all'elemento.Workflow consigliato
Inizia con un preset.
Aggiungi strati per profondità realistica.
Usa spread negativo per effetto card fluttuante.
Copia il CSS e incollalo.