Generatore di box-shadow CSS
Regola offset, sfocatura, espansione, colore e opacità con cursori e un selettore di colore per creare una box-shadow CSS, visualizzala dal vivo su un riquadro di anteprima, e copia la dichiarazione box-shadow generata direttamente nel tuo foglio di stile.
box-shadow: 4px 4px 12px 0px rgba(0, 0, 0, 0.35);Come funziona
L’offset X e l’offset Y spostano l’ombra orizzontalmente e verticalmente, il raggio di sfocatura ne ammorbidisce il bordo, e il raggio di espansione la ingrandisce o la riduce prima che venga applicata la sfocatura. Scegli un colore e un’opacità per l’ombra, e attiva «inset» per disegnare l’ombra all’interno del bordo del riquadro anziché all’esterno.
Suggerimento
Le ombre discrete di solito rendono meglio: un piccolo offset, un raggio di sfocatura pari a circa due-tre volte l’offset e un’opacità ben al di sotto del 50% danno un effetto di sollevamento morbido e naturale invece di un contorno pesante.
Posso sovrapporre più ombre?
Sì — la proprietà CSS box-shadow accetta un elenco di ombre separate da virgole, sovrapposte dall’alto verso il basso. Questo strumento genera un’ombra alla volta; combina più dichiarazioni generate (separate da virgole) per creare ombre sovrapposte e più realistiche.
Altri strumenti in questa categoria
Tester di espressioni regolari
Testa espressioni regolari su un testo di esempio con evidenziazione delle corrispondenze in tempo reale.
Analizzatore di espressioni cron
Analizza un’espressione cron a 5 campi in una descrizione in linguaggio semplice e visualizza le prossime esecuzioni.
Convertitore di codifica del testo
Converti il testo in esadecimale UTF-8, binario, punti di codice, Base64, codifica URL ed entità HTML contemporaneamente.
Generatore di password
Genera istantaneamente password forti e casuali, direttamente nel tuo browser.
Formattatore e validatore JSON
Formatta, convalida e minimizza JSON istantaneamente nel tuo browser.
Generatore di UUID
Genera UUID casuali versione 4 (RFC 4122) all'istante nel tuo browser.
Decodificatore JWT
Decodifica e ispeziona JSON Web Token (JWT) all'istante nel tuo browser.
Confronto testi
Confronta due blocchi di testo e visualizza subito ogni riga aggiunta o rimossa.
Generatore di slug
Trasforma qualsiasi testo in uno slug pulito e adatto agli URL, in tempo reale.
Convertitore di basi numeriche
Converti numeri tra binario, ottale, decimale ed esadecimale all’istante.
Convertitore di timestamp Unix
Converti timestamp Unix in date e date in timestamp Unix, in tempo reale.
Generatore di hash
Genera digest SHA-1, SHA-256 e SHA-512 da qualsiasi testo, direttamente nel tuo browser.
Generatore di espressioni cron
Crea una espressione cron valida a 5 campi con un modulo semplice — senza dover memorizzare la sintassi.
Generatore di Lorem Ipsum
Genera testo segnaposto Lorem Ipsum in paragrafi, frasi o parole per mockup e layout.
Anteprima Markdown
Scrivi Markdown a sinistra e guarda l'HTML renderizzato aggiornarsi in tempo reale a destra.
Calcolatore di sottorete IP
Inserisci un indirizzo IPv4 in notazione CIDR e ottieni rete, maschera, broadcast e intervallo host.
Ricerca codici di stato HTTP
Cerca qualsiasi codice di stato HTTP e scopri il suo significato standard in parole semplici.
Formattatore SQL
Trasforma SQL minificato o disordinato in istruzioni leggibili e indentate.
Convertitore da immagine a Base64
Converti un'immagine in un URI di dati Base64 da incollare direttamente in HTML, CSS o JSON — tutto nel tuo browser.
Comparatore Semver
Confronta due stringhe di versione semantica e scopri quale ha la precedenza, secondo le regole ufficiali del semver.