Generatore di ombra del testo (text-shadow)

Scrivi il tuo testo, regola l'ombra con i controlli e copia il codice text-shadow. Combinando più livelli puoi ottenere effetti neon, lettere in 3D, contorni o testo in rilievo.

Come funziona text-shadow

text-shadow accetta lo spostamento orizzontale e verticale, la sfocatura e il colore dell'ombra: ad esempio 2px 2px 4px rgba(0, 0, 0, 0.4). A differenza di box-shadow, non ha espansione né inset e segue la forma di ogni lettera.

Come in box-shadow, si possono concatenare più ombre separate da virgole; la prima sta sopra. Così si ottengono gli effetti degli esempi: il neon sovrappone ombre senza spostamento e sempre più sfocate, il 3D somma ombre nette spostate di un pixel alla volta e il contorno mette quattro ombre nette attorno alla lettera.

Leggibilità

Un'ombra leggera aiuta a leggere un testo sopra una foto, ma le ombre forti nei paragrafi lunghi stancano la vista. Usale nei titoli e nei pulsanti, e verifica sempre il contrasto del testo con lo sfondo.