我正在使用线性渐变和粒子作为背景（用于反应），但无法正常工作

Question

我有一个线性渐变背景，它会随着一些js函数的变化而变化

css代码：     background: linear-gradient(to right, rgb(0,0,255) , rgb(0,255,0));

javascript代码：

var body = document.querySelector("body");
var r = 255; var b = 100; var g = 100; var flag = true;
window.setInterval(()=>{
    body.style.background = 
    linear-gradient(to right, rgb(${r},0,${b}), rgb(${r},${g},0))`;
    if(flag){
        b+=5; g+=5; r-=5;
    }
    if(!flag){
        b-=5; g-=5; r+=5;
    }
    if(b===240 || b===95 ){
        flag=!flag;
    }
}, 300);

并且我在渐变背景https://www.npmjs.com/package/react-particles-js上使用粒子 我做了链接中的内容

.particles {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
}

但是最终，当我测试我的应用程序时，当我添加粒子时，一半的屏幕颜色将不再改变。