Changing the ‘Buy Now’ button color can improve the call to action (CTA) of your website. Colors have a psychological effect on shoppers. The majority of research studies presented that red button colors have escalated conversions compared with a green button. Red may be a dominant color but it may not apply to all websites. Selecting a good CTA button would make a difference on your website.

Tip:

You may change the background color and color according to your preference. You may use either hex-decimal code or color name.

You can pick a color using online HTML color picker tools: https://www.w3schools.com/colors/colors_picker.asp

How to Change the Color of the Buy it Now Button

STEP 1

In Shopify Admin, select Online Store.

STEP 2

Select your Debutify Shopify theme and click on Customize.

STEP 3

Located on the bottom part of the sidebar menu, tap Theme actions.

STEP 4

Tap Edit Code.

STEP 5

Go to Assets folder and select theme.scss.liquid.

STEP 6

Here is an example code that you may paste at the bottom in a new line:

.product-single__form .shopify-payment-button .shopify-payment-button__button.shopify-payment-button__button--unbranded{
background-color: #066828;
border-color: #00612c;
color: #fff;
}

You can pick a color using online HTML color picker tools: https://www.w3schools.com/colors/colors_picker.asp

Did this answer your question?