animatedColorGradient.js

const backgroundGradient = (() => {
  let grad = document.querySelector('body'),
    degree = 0,
    red = 200,
    green = 0,
    blue = 100,
    redup = true,
    greenup = false,
    blueup = false;

  const genRGBcolorSet1 = () => `${red}, ${green}, ${blue}`;
  const genRGBcolorSet2 = () => `${green}, ${red}, ${blue}`;

  const animateGradient = () => {
    grad.style.background = `linear-gradient(${degree}deg, rgb(${genRGBcolorSet1()}), rgb(${genRGBcolorSet2()}))`;
    degree++;

    if (red === 254) redup = false;
    if (red === 1) redup = true;

    redup ? red++ : red--;

    if (green === 254) greenup = false;
    if (green === 1) greenup = true;

    greenup ? green++ : green--;

    if (blue === 254) blueup = false;
    if (blue === 1) blueup = true;

    blueup ? blue++ : blue--;

    if (degree === 361) degree = 0;
  }
  setInterval(animateGradient, 100);
})();