How can I change the color of "Add to Cart" button when someone hovers it?

[reignnnx]

I tried this code but it’s not working.
Like from the default light pink to a darker one when someone hovers over the ‘Add to cart’ button.

.product-form__submit:hover {
background: #2a4653;
color: #fff;
}

[Moeed]

Hey @reignnnx
Kindly share your Store URL and Password if enabled

[Made4uo-Ribe]

Hi @reignnnx ,

Would you mind to share your URL website? with password if its protected. Thanks!

[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:

.product-form__submit:hover {
background: #2a4653 !important;
color: #fff !important;
}

[websensepro]

Hi, @reignnnx .

You can try this code: it will be helpful to you
Go to the Online Store->Theme->Edit code->Assets->base.css>Add this code at the bottom.

.product-form__submit:hover {
    background: #c3a1a2 !important;
    color: white !important;
}

Result:

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

[reignnnx]

Hi, still not working. I want it to be like this.
First photo is a lighter one then when I hover the “Add to Cart” button, it’ll change to a different color.

[reignnnx]

I want it to be seen in the Featured products. My store has yet to be made live so I’m just testing things.

The first photo is a lighter one then when I hover the “Add to Cart” button, it’ll change to a different color.

[reignnnx]

This is the current color rn: #dce2f9 and I want it to change to #d2afff when I hover it.

[oscprofessional]

Hello @reignnnx

Please provide your store URL and, if it is password protected, please share the password so I can review it and provide a solution.

[reignnnx]

Hi, here it is: https://f3b391-2.myshopify.com/

[reignnnx]

I somehow want it to be like this:

https://jeffreestarcosmetics.com/

[reignnnx]

Hi, here it is: https://f3b391-2.myshopify.com/

[oscprofessional]

Hello @reignnnx

Your store is password protected, please share the password so I can review it and provide a solution.

[reignnnx]

Ohh sorry. It’s reignabc

[Moeed]

Hey @reignnnx

Follow these Steps:

1. Go to Online Store
2. Edit Code
3. Find theme.liquid file
4. Add the following code in the bottom of the file above tag

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[oscprofessional]

@reignnnx
Hello, Add This CSS Go To Online Store > Select Current Theme > edit code > Assets > base.css

button:hover {
	background-color: #9aa9e6 !important;
}

Like This

[reignnnx]

Yay, this works! Thank you!!

[reignnnx]

This works fine as well! Appreciate it!