Neon Text Effect
Glowing neon text with animated pulsing effect and multiple shadows.
text
neon
glow
animation
Preview
Loading preview...
HTML
<div style="background: #000; padding: 60px; border-radius: 8px;">
<div class="neon-text">NEON</div>
</div>
CSS
.neon-text {
font-size: 48px;
font-weight: bold;
color: #fff;
text-align: center;
text-shadow:
0 0 5px #00ffff,
0 0 10px #00ffff,
0 0 20px #00ffff,
0 0 40px #00ffff,
0 0 80px #00ffff;
animation: neon-flicker 1.5s infinite alternate;
font-family: 'Courier New', monospace;
}
@keyframes neon-flicker {
0%, 100% {
text-shadow:
0 0 5px #00ffff,
0 0 10px #00ffff,
0 0 20px #00ffff,
0 0 40px #00ffff,
0 0 80px #00ffff;
}
50% {
text-shadow:
0 0 2px #00ffff,
0 0 5px #00ffff,
0 0 8px #00ffff,
0 0 12px #00ffff,
0 0 20px #00ffff;
}
}