Use Variant Image as Color Swatch Focal Theme

Hello @Xipirons ,

Thank you for your previous advice, @Xipirons. However, I’m still on the hunt for a specific functionality. In my last theme, I utilized variant images as interactive color swatches on product pages. For instance, if I’m selling a T-shirt that’s available in Black, White, and Grey, each color option was directly linked to its respective image in the product’s gallery. Selecting the Black variant would bring up the Black T-shirt image, and the same for the other colors.

My goal is to replicate this feature with the Focal theme, where the color swatches are effectively synced with the corresponding variant images. So instead of just standard color blocks for swatches, they would showcase the actual product image in that variant’s color. How can I set up the Focal theme to reflect the variant images when a color swatch is selected?

Similar to this theme: https://themes.shopify.com/themes/fashionopolism/styles/haute/preview?surface_inter_position=1&surface_intra_position=6&surface_type=industry