Change layout color

Question

I wanted to create a function to change the colors of the layout of the site that they are developing, this site is made in Codeigniter, CSS3 and a bit of pure Javascript, I did a search on the internet and did not find much, but from the little knowledge I have I believe that this type of modification is in JS. The function would be in the Dashboard and the user can change the colors as soon as desired, colors already preset.

Answer 1

Exactly, you can use JS using the attribute .style to change the CSS of a div. Take this example

#quadrado {
    background: #000;
    width: 100px;
    height: 100px;
}

<div id='quadrado'></div>

<button type="button" onclick="document.getElementById('quadrado').style.background = 'blue'">Deixar azul!</button>
<button type="button" onclick="document.getElementById('quadrado').style.background = 'red'">Deixar vermelho!</button>
<button type="button" onclick="document.getElementById('quadrado').style.background = 'green'">Deixar verde!</button>

In it, when clicking on any of the buttons, select the square through the ID and change the property background, inserting the color we want. This is just a basis for you to customize according to your needs.