how to change Add to Cart button from square one or the rounded one like this?

how to change Add to Cart button from square one or the rounded one like this?

Senku
Excursionist
37 0 17

how to change Add to Cart button from square one or the rounded one like this? i only want to change "Add to Cart" button. i prefer to use custom css

Screenshot 2025-04-26 at 08.26.02.pngScreenshot 2025-04-26 at 08.29.49.png

Replies 3 (3)

BiDeal-Discount
Shopify Partner
797 107 180

Hi,

 

please share your store url to let me check which class selector to CSS, normally you can use:

.add-to-cart {
  border-radius: 10px;
}

with .add-to-cart is your class selector

- Helpful? Like & Accept solution! Coffee tips fuel my dedication.
- BiDeal Bundle Volume Discounts: Upsell with discount bundles, quantity breaks, volume discounts & mix-and-match bundles. AOV+ with free gifts, free shipping & progressive cart
- Contact me via WhatsApp
Senku
Excursionist
37 0 17

here it is: https://seasonalcollections.co/collections/all-products

 

your css didn't work

BiDeal-Discount
Shopify Partner
797 107 180

Thank you for provide site url, let try to add this css code:

button.product-form__submit, button.product-form__submit:before, button.product-form__submit:after {
  border-radius: 20px;
}

 

The result will be:

 

BiDealDiscount_0-1745632445291.png

 

- Helpful? Like & Accept solution! Coffee tips fuel my dedication.
- BiDeal Bundle Volume Discounts: Upsell with discount bundles, quantity breaks, volume discounts & mix-and-match bundles. AOV+ with free gifts, free shipping & progressive cart
- Contact me via WhatsApp