Colour Swatches Not Working

Store Design
, ,

Topic summary

A user encountered an issue where variant swatches stopped functioning after adding size options to a product. The same photo now displays multiple times, and clicking different colors doesn’t update the product image as expected.

Troubleshooting steps suggested:

  • Verify each color variant has the correct image assigned in the product’s Variants section
  • Ensure Color is listed as the first option (before Size) in variant settings, as Shopify prioritizes the first option for image switching
  • Check theme customization settings for variant image swatch configurations
  • Remove duplicate images from the product gallery
  • Test by disabling any custom code or apps that might interfere
  • Consider updating to the latest theme version

Current status: The discussion remains open with multiple users requesting the product page URL to provide more specific assistance. The issue likely stems from how Shopify handles image assignments when multiple variant options are present.

Summarized with AI on October 25. AI used: claude-sonnet-4-5-20250929.
1

Hi,

I just added sizes to my product and ever since I did, the variant swatches have completely stopped working and now the same photo is showing up multiple times. Also whenever I click on a different colour, the photo for that colour isnt showing up. If someone can help me that would be appreciated.

Screenshot 2025-08-18 at 7.15.56 pm
Screenshot 2025-08-18 at 7.15.56 pm766×272 27.3 KB

2

Did you go to edit your product and update images for your variants?

3

Yes, my variant photos are the same as the main colour photo

4

Could you share the link to your product page so I can check?

5

Hey @Furro ,

Welcome to the Shopify Community!

I understand how frustrating it can be when your variant swatches stop working after adding sizes. From what you described, it sounds like the issue is related to how your variant images are configured in Shopify. Here are a few steps you can try:

  1. Check Variant Image Assignments

    • Go to your product in the Shopify admin.

    • Scroll down to the “Variants” section.

    • Make sure each color variant has the correct image assigned. (If not, Shopify won’t know which image to show when that variant is selected.)

  2. Confirm Option Order

    • If you’ve added a new “Size” option, Shopify might now be prioritizing size over color when swapping images.

    • Ensure that Color is the first option in your variant settings (under Options). This helps Shopify know that images should switch by color first.

  3. Theme Settings

    • Some themes have settings for “Variant Image Swatches.” Go to Online Store > Themes > Customize and check if there’s a setting to link images to the first option (usually color).

  4. Code Adjustments (if needed)

    • If your theme isn’t handling multiple options correctly (color + size), you may need a small code tweak to ensure images change only when the color is switched, not when size changes.

If you’d like, I can help you directly implement this fix in your theme so everything works smoothly again. Please feel free to reach out via email - you’ll find my contact info in my portfolio here: https://rajatweb.dev/

You can also check my past work there to get an idea of my experience.

Wishing you the best with your store setup!

Rajat | Shopify Expert

6

Hi @Furro,

Please send the website link, I will check it for you

7

Hi,

Hope this will help

  • Put Color first
  • Link right image to every variant
  • Turn on swatches in your theme
  • Clean up duplicate gallery images (optional)
  • If you used code edits or apps, turn them off one by one and test.
  • Update to latest theme version and test on unpublished copy.