In the theme editor: CustomizeTheme settingsProduct cards

Product cards

How products look everywhere they appear in a grid: the image, the name and price, the coin for a quick add, and the badges.

A product’s own “Badge” field shows its own word on the card, such as “New”. Sale and sold-out badges come automatically.

Settings

Image

Image ratio
Choice: Square, Portrait, Landscape, Match the product imageDefault: Portrait
Image corners
Slider, 0 to 40 pxDefault: 12 pxFrom 0 (square corners) to fully rounded. 12 matches the button corners.
Show second image on hover
On or offDefault: OnOnly on devices with a mouse.

Content

Show vendor
On or offDefault: Off
Color dots
On or offDefault: OnTiny dots under the price when a product has a color option, from Shopify's color swatches or the color name.

Coin on the card

What the coin on the card does
Choice: Smart, with peek on every card (recommended), Smart only, Always open the quick view, No coin: the whole card opens the productDefault: Smart, with peek on every card (recommended)Smart: a product without options goes straight to the cart. A product with one choice (size, color or material) opens a fan of its values on the card itself, and a tap adds it. A product with several options opens quick view. "Peek" adds a small glass button in the top corner that always opens quick view.
Plus button color
ColorThe plus on product images. Blank: the dark color of the page. A color fills the plus.
Plus icon color
ColorBlank: chosen automatically, dark on a light plus and light on a dark one.
Add button when ready
ColorDefault: #2563EBThe plus on a product card, once its short fan is open and another tap adds the product to the cart. If it is the same as the plus color, the plus swaps its colors, so it always changes.
Plus on the add button
ColorDefault: #FFFFFF

Details

Sale percentage on the badge
Choice: Shown price (recommended), Up to: the highest discount, Hide when percentages differDefault: Shown price (recommended)For products whose variants have different prices. Shown price: the percentage and the compare-at price belong to the variant whose price the card shows. If it is not on sale there is no sale badge. Up to: the highest discount on the product, worded "up to". Hide: a sale badge only when every available variant has the same percentage. Products with a single price are not affected. On the product page and in quick view the shopper picks a variant and the price and percentage always belong to it, so this setting does not apply there.
Card price weight
Choice: Regular, BoldDefault: RegularThe price on product cards in collections, search and product rows. Bold matches the product page.
Badge on discounted products
Choice: Sale, Percentage (23% off)Default: SaleWhat the pill on the image says when a product is on sale. For your own text on any product (New, Bestseller), fill in the product metafield custom.badge.
Shine on the button
On or offDefault: OnA light sweep every few seconds, only while the button is on screen.

Something here doesn’t match what you see in your editor? Tell us and we will fix the guide.