Ombra del testo CSS
Componi ombre del testo multistrato con anteprima dal vivo e CSS pronto da copiare.
- Istantaneo
- Gratis
- Privato (elaborato localmente)
- Senza registrazione
Ombre del testo su misura
Imposta offset, sfocatura, colore e opacità, aggiungi un secondo livello e ottieni la proprietà text-shadow con anteprima dal vivo sul testo.
-
Imposta il livello 1
X, Y, sfocatura, colore, opacità.
-
Attiva il livello 2
Per un contorno o un bagliore.
-
Copia il CSS
Una sola proprietà, pronta da incollare.
Anatomia della proprietà
| Parte | Esempio | Ruolo |
|---|---|---|
| Offset X | 2px | Orizzontale (negativo = sinistra) |
| Offset Y | 2px | Verticale (negativo = alto) |
| Sfocatura | 4px | Diffusione dell’ombra |
| Colore | rgba(124, 58, 237, 0.5) | Tonalità e opacità |
Livello predefinito: text-shadow: 2px 2px 4px rgba(124, 58, 237, 0.5);. Anteprima e calcolo 100% locali.
Domande frequenti
Come funziona text-shadow?
La proprietà prende, in ordine: offset orizzontale X, offset verticale Y, raggio di sfocatura, poi il colore. Esempio: text-shadow: 2px 2px 4px rgba(124, 58, 237, 0.5). Valori negativi spostano a sinistra/in alto.
Si possono sovrapporre più ombre?
Sì, separate da virgole. Questo strumento offre due livelli: il primo disegna l’ombra principale, il secondo (opzionale) aggiunge un contorno o un bagliore di un altro colore.
Come creare un effetto bagliore (glow)?
Metti X e Y a 0, aumenta la sfocatura e scegli un colore vivo con buona opacità. La luce si diffonde uniformemente attorno al testo. Duplica il livello per intensificare.
L’ombra danneggia la leggibilità?
Un’ombra troppo marcata può disturbare. Per il testo corrente, mantieni una sfocatura leggera e opacità moderata; riserva gli effetti marcati ai titoli grandi. L’anteprima aiuta a valutare.