Text Shine
Gradient text with a moving highlight — great for headings.
Preview
Tune parameters
Full code
/* Text Shine */
@keyframes textShine {
0% { background-position: 0% 50%; }
100% { background-position: 200% 50%; }
}
.text-shine { background: linear-gradient(90deg, #2563eb, #a855f7, #2563eb); background-size: 200% auto; -webkit-background-clip: text; background-clip: text; color: transparent; animation: textShine 3s linear infinite; }