.animated-rainbow { font-size: 42px; font-family: Arial Black, Gadget, sans-serif; background: linear-gradient(to left, #f00, #ff2b00, #f50, #ff8000, #fa0, #ffd500, #ff0, #d4ff00, #af0, #80ff00, #5f0, #2bff00, #0f0, #00ff2a, #0f5, #00ff80, #0fa, #00ffd5, #0ff, #00d5ff, #0af, #0080ff, #05f, #002aff, #00f, #2b00ff, #50f, #8000ff, #a0f, #d400ff, #f0f, #ff00d4, #f0a, #ff0080, #f05, #ff002b, #f00); animation: rainbow-move-left-right 5s linear infinite alternate; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; } @keyframes rainbow-move-left-right { 0% {background-position: 0 0 } 100% {background-position: -500px 0} }