:root { --gradient-loader-1: rgba(38, 38, 38, 0); --gradient-loader-2: rgb(255, 255, 255); } .animated-gradient { background: repeating-linear-gradient( to right, var(--gradient-loader-1) 0%, var(--gradient-loader-1) 35%, var(--gradient-loader-2) 50%, var(--gradient-loader-1) 53%, var(--gradient-loader-1) 100% ); width: 100%; background-size: 200% auto; background-position: 0 100%; animation: gradient 2s infinite; animation-fill-mode: forwards; animation-timing-function: linear; } @keyframes gradient { 0% { background-position: 0 0; } 100% { background-position: -200% 0; } }