Shopify themes, liquid, logos, and UX
I'm trying to add color swatches to my updated Studio theme. I've looked everywhere in the Product page and the Settings only have "product card" with no mention of swatches.
I thought maybe there just wasn't any swatch capability in Studio but I've seen others with Studio using swatches, plus in my code there is reference to displaying swatches as a circle/square in the main-product.liquid file so I feel like they must be there somewhere. Any ideas? Site is www.sweetviolet.co.
Hi @SweetViolet
The Shopify Studio theme does support color swatches, but enabling them requires specific configurations. Here's how you can set them up:
Verify Variant Naming:
Ensure your product variants are named "Color" or "colour" to align with Shopify's default swatch functionality.
Assign Color Values:
For each product, specify the color values (e.g., Red, Blue, Green) in the variant options.
Enable Swatches in Theme Settings:
Navigate to your Shopify admin panel: Online Store > Themes.
Click Customize next to your active theme.
In the theme editor, select Theme Settings.
Look for a section related to Products or Variants.
Enable the option for Color Swatches.
Add Custom Swatch Images (Optional):
If you prefer specific images for swatches, upload swatch images to your theme's assets and ensure they match the color names.
For a visual walkthrough, you might find this tutorial helpful:
Shopify Tutorial - How To Add Color Swatches (beginner friendly)
https://youtu.be/dSpB53XgmIo
Thank you for your reply. These are the exact instructions I followed, but there are no Products or Variants in the Settings, just Product Card with basic settings. I did watch the video and they mentioned setting the variants to pills, which I could do through the Product Template, not the Settings (mine were set to dropdown). I tried to follow the code changes but I could not find the code mentioned in the video anywhere in my main-product.liquid file. If anyone has any ideas, I would be very grateful.
I watched another video on how to use metafields to set up variants and now my site is broken. Customers can't order anything based on size anymore. I am begging anyone out there for help.
Hi @SweetViolet
If you want to try an app, Easify Product Options lets you add color swatches easily without coding. It gives you full control over how swatches appear on your product page. Here's how it works:
This app is simple to set up, and I hope you check it out. Let me know or reach out to Easify if you need any support! 🤗
Hello @SweetViolet,
If you're looking for an easy way to add color swatches to your product pages, I recommend trying the Inkybay - Product Personalizer app. This app allows you to easily integrate color swatches on your product pages. You simply need to upload a white image and select a color set, which will automatically map to the chosen color. Alternatively, you can use individual images for each color to display the color swatch on the product page. Additionally, it offers robust personalization features to enhance the customer experience. You can take advantage of a free 21-day trial to see if it works for you.
Shopify and our financial partners regularly review and update verification requiremen...
By Jacqui Mar 14, 2025Unlock the potential of marketing on your business growth with Shopify Academy's late...
By Shopify Mar 12, 2025Learn how to increase conversion rates in every stage of the customer journey by enroll...
By Shopify Mar 5, 2025