How can I change the color of the “add to cart” button from orange to #576166 throughout the entire site if possible?
Here is a link to my unpublished site: https://z2fbb5cc6x4vtsws-57200312371.shopifypreview.com
Topic summary
A user seeks to change the Pipeline theme’s “add to cart” button color from orange to #576166 across their entire Shopify site.
Solution provided:
- Navigate to Online Stores > Themes > Edit code
- Locate the theme.liquid file
- Add custom CSS code above the tag to override the button color
Follow-up request:
After successfully implementing the color change, the user asks to modify the hover/rollover effect to display a lighter gradient (approximately 15% lighter than #576166) instead of the default orange.
Final outcome:
Additional CSS code is provided to create the desired hover gradient effect. The user confirms both solutions work successfully and the issue is resolved.
This is Noah from PageFly - Shopify Page Builder App
Hi @awirtz Please add code here to fix it:
Step 1: Online Stores > Themes > Edit code
Step 2: Choose file theme.liquid
Step 3: Add code above the tag
Hope my solution will help you resolve the issue.
Best regards,
Noah | PageFly
Thank you Noah, that worked! Is there a way I can change the rollover color to be a 15% gradient of #576166? Right now it rolls over to a light orange color. Thanks!
1 Like
You want to apply gradient to border or text color, or background Button?
I would like to add a background color that is light grey or about 15% of the #567166 on the rollover.
Thanks.
1 Like
Hi @awirtz Please add code here:
1 Like
That works great! Thank you for the help, I appreciate it.
1 Like
Thank you , Have a nice day 
!