We would like to change only the add-to-cart button color without changing the Accent 1 background color. Any help is appreciated.

Hi again, You can add the code to Custom CSS section to change the color of icon on mobile: @media (max-width: 991px) { .product-form .cartmobile { background-color: #df2c21; } }

Hi @fukuyafoods , Can you send me the page link that contains that button that you want to change please? Thank you

Hi Liz, Thank you for your reply. https://fukuya.ca/products/syukaen-shine-muscat-grapes?variant=46025777250563 This is the product page we want to change the color of the add to cart button. Also on the home page as well. https://fukuya.ca/ Thanks

Hi @fukuyafoods , You can follow the instruction here to change your button color in Product page: Go to Shopify > Theme > Customize > open Custom CSS Copy and paste this code to the section > Save. You can change the color code as the color you want. .product__info-container .product-for…

Hi Liz, Thank you for your help. I’ve changed the color of the Add to cart button on the product page. Is there a way to also change the color of add to cart botton (or icon on mobile) on my home page and collection main page as well? https://fukuya.ca/collections/bluefin-tuna www.fukuya.ca Tha…

Hi @fukuyafoods , To change the Add to cart button on Collection page, you can add this code on Custom CSS section: .button, .shopify-challenge__button, .customer button, .wbproducttab .spr-container .spr-summary-actions-newreview { background-color: #823c3c; }

Hi Liz, Thank you so much again for your help. Just one last thing how do I change just the add to cart icon on mobile? Its showing the original color. Thanks.

Thank you so much for your help! :blush:

Hi Liz, I noticed the “subscribe” to news letter button on home page is also changed into red. Can we reverse it to original? Also, there’s a black outline to all the red add to car buttons. Is it possible to remove it or change it to the same red color that we currently have? Much appreciate for…

Hi @fukuyafoods You can change the color of subscribe button by adding these codes to Custom CSS section. You can change it to the color that you want. For Desktop: @media (min-width: 992px) { .newsletter-form__field-wrapper .button { background-color: #ffff; } } For Mobi…

Change Add-to-cart button color on Viola Theme

Store Design

fukuyafoods November 6, 2024, 12:40am 12

Hi Liz,

Thank you for your prompt reply.

Also, there’s a black outline to all the red add to cart buttons. Is it possible to remove it or change it to the same red color that we currently have?

Thanks

Topic		Replies	Views
FASTOR theme V5.2: Change the color of the add to cart button Store Design	10	59	June 3, 2023
I am unable to change color of add to cart button at my shopify store Store Design product-page	2	36	October 20, 2023
How can I change the color of the 'add to cart' button? Store Design design , customizations , collection-page , css , cart-page , shopify-themes , html , product-page	9	419	March 28, 2025
Change the Add to Cart button colour in Shopify Responsive premium theme Store Design	1	115	April 11, 2022
Changing JUST Add to Cart Button Color - Dawn Theme Store Design design , css , shopify-themes , product-page	3	255	January 26, 2025

Change Add-to-cart button color on Viola Theme

Related topics