Progetta ombre CSS visivamente — regola offset, sfocatura, diffusione, colore e opacità e copia il CSS.
La proprietà box-shadow dà profondità agli elementi piatti. Accetta cinque valori: l'offset orizzontale, l'offset verticale, il raggio di sfocatura, il raggio di diffusione e il colore. Un'ombra sottile con molta sfocatura e poco offset si legge come elevazione; un'ombra stretta con un forte offset si legge come un bordo netto. I designer regolano questi numeri a sensazione, il che significa trascinare slider e vedere il risultato — esattamente ciò che fa questo strumento.
La casella di anteprima al centro mostra l'ombra mentre muovi gli slider. La riga CSS sottostante si aggiorna in tempo reale: copiala e incollala nel tuo foglio di stile. Lo strumento supporta anche le ombre inset, che si dipingono all'interno dell'elemento anziché all'esterno — utili per pulsanti premuti, campi di input e pannelli incassati.
Tutto gira nel tuo browser. L'anteprima è un vero box-shadow CSS applicato a un div, non un rendering o un'approssimazione. Ciò che vedi qui è ciò che vedranno i tuoi utenti.
box-shadow: [inset] offset-x offset-y blur-radius spread-radius color
Espande o contrae l'ombra prima della sfocatura. Un valore di diffusione positivo rende l'ombra più grande dell'elemento; uno negativo la rende più piccola. Zero significa che l'ombra ha le stesse dimensioni dell'elemento.
Sì, nel CSS. Questo strumento genera un'ombra. Per aggiungerne altre, separale con virgole nel tuo foglio di stile.
Dipinge l'ombra all'interno dell'elemento anziché all'esterno. Utile per pulsanti in stato premuto o pannelli incassati.
Sì. L'ombra segue automaticamente il border-radius dell'elemento.
Perché lo slider dell'opacità necessita di un canale alfa. I colori hex sono opachi; rgba permette all'ombra di essere semi-trasparente, il che appare più naturale.
Vai.la trasforma qualsiasi URL in un link breve con statistiche dei clic, QR Code e il tuo biolink personale.
Vai.la non è responsabile dell'uso degli strumenti né delle decisioni prese in base ai loro risultati.