Random background color help

Hey guys,

Trying again to see if someone knows a way for me to randomize the different color background animations I’ve made. I’ve made an animation that filters through 5 selected colors and shows each one of the for 15 seconds before showing the next one. Really basic stuff… but I can’t figure out how to randomize the color selection between those 5 colors. Basically all I want is for everytime the page is refreshed, one of those 5 colors are shown.

I will be happy if you could even provide just a custom code that filters through the 5 colors at random.

Here are the 5 colors:
#D2D8CC
#83735B
#FF2C34
#FF546E
#C7FF64

I know there’s a simple way to do this but I need some experienced help. Haha Thank you!


Here is my site Read-Only: Webflow - Vox Studios

hi @Stephen_Bement it is very simple task.

Thats A good to be used

Hey there! Can you please elaborate. I’m sorry the guys on the page you linked were speaking hieroglyphic’s to me unfortunately haha. Is there a simple code I can copy and paste onto my home page?

hi @Stephen_Bement all you need is to get random color to start with is to run your function when page is loaded. So you need something like this.

window.addEventListener("load", function() {
    // run your function
});

The load event is fired when the whole page has loaded, including all dependent resources such as stylesheets and images. This is in contrast to DOMContentLoaded, which is fired as soon as the page DOM has been loaded, without waiting for resources to finish loading.

OR

window.addEventListener('DOMContentLoaded', (event) => {
   // do your stuff eg.run your function
});

The DOMContentLoaded event fires when the initial HTML document has been completely loaded and parsed, without waiting for stylesheets, images, and subframes to finish loading.

this mean that after DOM is loaded your function will be invoked and will set (generate) random bg color for CSS to be applied.

hi @Stephen_Bement I see that you have created a new request for identical task. so here is example with exactly you have asked for mean changing color and have on page load different color to start with

Hope this will solve your request