Hello I want to change the color of the Add to Cart button only. I now have this code in Base.cc:
button[name=“add”] {
background: #027afe !important;
color: white;
box-shadow: none;
It changed the color but it now has the old color as the border.
It is supposed to be completely blue, and not blue with pink border.
Hi @userrnamennen ,
The background color is different to the border. If you dont like the pink border you can change it by using
border: 1px solid #027afe;
so the color will be same with background button. Or you can also change the border color what ever you like. Add this border code before the end curly bracket }.
I hope it help.
Even when I change the border to 4px it keeps having this pink ring around it.
Oh okay, Im not sure if that is the right selector on the border. Would you mind to share your URL website? with password if its protected. If you dont like to share you can PM me. thanks!
I have sent you the link in PM
Thank you for the information. Your store is a bit tricky 
, I try to find some solution to take of the border. I manage to take of the pink color but it change to white. Please, remove the border if you add this code.
The one giving the color pink is the border-opacity.
.button, .shopify-challenge__button, .customer button, button.shopify-payment-button__button--unbranded, .shopify-payment-button [role="button"], .cart__dynamic-checkout-buttons [role="button"], .cart__dynamic-checkout-buttons iframe {
--border-opacity: 1;
}
Result:
If this wont work then you need to find the code in the base.css and add this one the code:
/–border-opacity: 1;/ or totally remove the code.
I hope it help.
It worked, thank you!
