Can I change my header logo color to #900c3f on hover?

[Gustavo1105]

I want the logo on my header to change to #900c3f when hover, is that possible?

Site Link

[dbuglab · Accepted solution]

Hi @Gustavo1105 

You have to upload the 2 logos and call them into the header.liquid file.
using css you can show second logo on hover.

If needed any help from my end please let me know.

Thanks
Dbuglab

[ZestardTech]

Hello there,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:

.header__icon .icon:hover {
color: #900c3f;
}
.header__heading-logo {
filter: grayscale(100%);
transition: filter 0.3s, color 0.3s;
}
.header__heading-logo:hover {
filter: none;
color: #900c3f;
}

[CharBar93]

Hello

I am using Monaco theme.

How do I change the header logo on hover?

I have an overlay header.

Which is only stick when scrolling up.

Despite it being overlay, when I am full scrolled up in idle mode (not scrolling) and I hover on my transparent overlay header, a white header background appears - which I don't necessarily want. 

But if it has to stay, then I would like the logo to change to black colour so that you can see it (I have the logo saved in my files really to be called into the theme code).

Thanks for your time 🙂

https://londonfermentary.myshopify.com/

Password: transfer