Card swatches let shoppers see and switch colours from the collection grid, without opening the product.
Open Swatchfy → Variant swatches.
Under Product card swatches, turn on Enable on product cards.
They then appear wherever your theme uses its standard card layout — collections, search results, homepage sections and recommendation rows.
Setting | What it does |
Show only the first variant option | Only the first option gets swatches. Keeps cards clean when a product has both Style and Colour. |
Hide non-visual options on cards | Only the option names from your Option names list appear, so Size does not fill the grid. |
Change product card image on hover | Hovering a swatch previews that variant's photo. |
Click / tap behaviour | Set separately for desktop and mobile. On: the card's image and link switch to that variant. Off: the swatch behaves as a link to the product page. |
Load the highlighted swatch's image | Each card opens showing the image of its highlighted swatch, rather than the theme's default. |
Hide single-value rows on cards | A product with one colour shows no row at all. |
The card's image and its link change to the selected variant, and quick-add follows the selection.
The price shown on the card does not change. That is deliberate: your theme formats prices for its own currency, locale and sale rules, and a swatch app rewriting that text gets it wrong for some stores in ways that are hard to notice. The shopper sees the correct price for their selection on the product page.
Cards are found through your theme's own card layout, and homepage sections are where themes vary most — especially sections built with a page builder. If the settings above are right and swatches still do not appear on a page, send us that page's URL and your theme name.
