how to change icon colors on different pages?

[OlaDobson]

I have a transparent header on my homepage, with light color icons on it (#F3EBE0). on my other pages i have the light color as a background and i would like the icons to be in a darker shade of red (#721817). how can I adjust the colors to be different from the home page?

Thank you

[BSSCommerce-TA]

hi @OlaDobson , can you give me your store website url.

[OlaDobson]

hey BSSCommerce, I have already founf the code that will fix it: 

<script>
document.addEventListener('DOMContentLoaded', function() {
const icons = document.querySelectorAll('.icon');
const homepageColor = '#F3EBE0';
const otherPagesColor = '#721817';

if (window.location.pathname === '/') {
icons.forEach(icon => {
icon.style.color = homepageColor;
});
} else {
icons.forEach(icon => {
icon.style.color = otherPagesColor;
});
}
});
</script>