Create CSS gradient text using the background-clip: text technique — pick colors, angle, animation speed and font. Copy the ready-to-use CSS instantly.
CSS gradient text uses three properties together: background: linear-gradient(...) sets the gradient, -webkit-background-clip: text (plus the unprefixed version) clips the background to the character shapes, and -webkit-text-fill-color: transparent makes the text itself transparent so the background shows through. The animated version uses background-size: 200% 200% with a background-position keyframe animation to shift the gradient. This technique works in all modern browsers. One caveat: because the text color is technically transparent, text-shadow will not apply — use filter: drop-shadow() instead if you need a glow effect.