What Variant Swatches are

If you sell a t-shirt in five colors and each color is a variant of one Shopify product, the default storefront shows a dropdown labeled “Color” with text options like Black, Blue, and Red. Variant Swatches replace that dropdown with a row of visual swatches - color circles, image thumbnails, or styled text pills - so customers can pick a variant by sight instead of by reading.

Same Shopify variants, same product page, same checkout flow. The app upgrades how the option selectors look without changing what they do.

See Variant Swatches live on the demo store

When to use Variant Swatches

Reach for them when:

Your colors, sizes, materials, or other options are variants of one Shopify product.
The default option dropdowns feel out of place on a visually-driven catalog.

If each color is its own Shopify product, Product Groups is the better fit. The two features work together if your catalog mixes both setups.

What’s available

Three swatch styles per option - color or image swatch (the visual circle), variant image (whole product photo as a thumbnail), or pill button (styled text).
Auto-detect colors - the app names the standard colors automatically (Black, Red, Navy) and falls back to AI for unusual ones. Anything it misses you can link by hand.
Section grouping - split a single option into labeled sections (e.g. “Solid Colors” / “Patterns” / “Limited Edition”).
Out-of-stock styling - choose how unavailable variants render: faded, strikethrough, hidden, or sorted to the end.
Per-product opt-in - run the feature across the whole store or only on a chosen list of products.
Collection page support - swatches appear on collection cards too, so shoppers can pick a color before clicking through.