Change the icon background

You are here:
< Back

 

CSS Code

While our built-in colour picker allows you to change the colour of all the icons, you may wish to have a custom colour for each feature…

Add this code to the CSS box. You will change the hex code (e.g #0099C7) of each line to change its colour.

 

.layout li:nth-child(1) {
background-color: #0099C7;
}
.homepage .layout li:nth-child(2) {
background-color: #ffd64b;
}
.homepage .layout li:nth-child(3) {
background-color: #ff3a2e;
}
.homepage .layout li:nth-child(4) {
background-color: #9d5cad;
}

 

 

  • This will only change the first 4 icon backgrounds, you can always copy and paste lines to add new ones. Just remember to change the (4) to (5) and change the colour.

Previous

Next