@keyframes animated_title_animation { 0%,100% { background-position: 0 0; } 50% { background-position: 100% 0; } } .animated-title { .text { //background: linear-gradient(to right, #6666ff, #0099ff , #00ff00, #ff3399, #6666ff); background: linear-gradient(to right, var(--bg-color-1), var(--bg-color-2) , var(--bg-color-3), var(--bg-color-4)); background-clip: text; color: transparent; animation: animated_title_animation 60s ease-in-out infinite; background-size: 400% 100%; } }