Meta Theme-color and background with equal colors

Question

Talk people...(don’t mind if I talk any nonsense during the text, I’m secular about it). I am since yesterday developing a page using javascript settings to make an interaction. My challenges were:

1º Make a page that changed color with each update.

2º Make the Theme-color goal and background receive the same colors every page update.

I managed to accomplish the first two challenges with the following configuration, inside the head: follows code

<script>
//mudar theme-color
function getRandomRGBValue() {
    return Math.min(Math.floor(Math.random() * 255 + 1), 255);
}
function getRandomColor() {
    var r = getRandomRGBValue(),
        g = getRandomRGBValue(),
        b = getRandomRGBValue();
    return "#" + (((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1));
}

//recebe a cor que foi gerado no getRandomColor para utilizar a mesma cor, tanto no <meta theme-color> quando na função que muda a cor do body.
var CorBackTheme=getRandomColor();

//função executada para mudar o content do theme-color
function changeThemeColor() {
    var metaThemeColor = document.querySelector("meta[name=theme-color]");
    metaThemeColor.setAttribute("content", CorBackTheme);
	setTimeout(function() {
        changeThemeColor();
    }, 2000);
}

changeThemeColor();

//body collor
function carrega() {
	document.body.style.background=CorBackTheme;
	setTimeout(function(){
/*		carrega();
	}, 2000);*/
}
function atualiza(){
	setTimeout(function(){
/*		getRandomColor();
	}, 2000);*/
}
</script>

If you enter my site (cubomagi.) by Android system from version 5.0 on Chrome browser, both the Theme-color meta and background will be the same color every page update you make.

However, came my third challenge, which I am not able to accomplish is:

3º Change colors every 2 seconds.

The problem that happens is: when the getRandomColor() function generates a color, the Corbacktheme global variable receives the color of that function, then I use this variable in the changeThemeColor() function and in the load() function, which are the functions responsible for changing the color of the Theme-goalcolor and backgroud every page update. If you notice, within the two functions (chageThemeColor and load), I called the resource setTimeout(), which is responsible for changing the color in a certain time, but I left in comment form because it is not working. However, it even "performs" the action of changing the color every 2 seconds, only it changes to the same color that the Corbacktheme global variable receives only once. In my lay knowledge of programming logic, the idea would be to restart the getRandomColor() process so that the Colorbacktheme variable can receive a new color and then update the colors of the changeThemecolor() function and load() through the setTimeout resource().

The question is: how? (laughs)

In the function: changeThemeColor(), if you take the global variable Colorbacktheme and put the getRandomColor() function in its place, then the setTimeout() feature works, only the colors of the meta and background are not synchronized, because for each function (changeThemeColor and load) the getRandomColor() function generates a different color.

I am making available to you the document through a link in google drive.

Thank you for any reply and sorry for any error in the description of the problem.

att Carlos Rebelo