JSFiddle - React, Tailwind, and code Playground
HTML
<div class='a'></div>
CSS
.a {
background-color: red;
width: 100px;
height: 100px;
}
JavaScript
background = ['rgba(155,255,0,1)', 'rgba(40,50,20,0.3)', 'rgba(100,80,40,0.6), rgba(200,230,140, 0.5)'];
// these background colors need to be in a javascript array format [x, y, z]
// the figures here are html5 compliant red/green/blue/alpha format where alpha is the opacity of the div -- 0.5 = 50%.
var interval = setInterval(function () { // setInterval function makes the script run every specified time increment.
var randomPick = Math.round(Math.random() * (background.length - 1)); // generates number from 0 - 1, multiplies by # array elements, and rounds.
$('.a').css("background-color", background[randomPick]); // requires library
}, 1000); // this ends setInterval. number is measured in ms.
/*
For the jQuery line, the first tag after the '$' is what div this code references. Since you want the body background color to change you can change '.a' to 'body'.
The second selector that is currently 'background-color' can be changed to any css selector including blur. The third is the actual assignment. You could replace background[randomPick] with "red", and it'll assign as such. That just tells what color the background is.