Color swatches

Color swatches are visual representations of different color options available for a product. In Polyform, color swatches allow customers to see and select the various colors that a product is offered in. Instead of displaying color names in a dropdown menu, color swatches show clickable color samples, making it easier and more engaging for customers to choose their preferred color. This feature enhances the shopping experience by providing a clear and intuitive way for customers to explore and select product variants based on color.

Adjust Color Swatches

Our theme comes out of the box with standard colors you can use on your product color variants. We are using the default HTML Color Groups.

Instructions

Step 1: Create Metafields

Access Metafields

• Go to your Shopify admin panel.
• Navigate to Settings > Metafields.

Add a New Metafield Definition

• Click on Products.
• Click on Add definition.
• Name your metafield (e.g., "Color Swatch").
• Choose the type as Color.
• Save the metafield definition. c

Step 2: Assign Metafields to Products

Edit Product Metafields

• Go to Products in the Shopify admin panel.
• Select a product you want to add color swatches to.
• Scroll down to the Metafields section.
• Find your new metafield (e.g., "Color Swatch") and input the color value (e.g., #ff0000 for red).

Repeat for All Variants

If your product has multiple variants, repeat the process for each variant, assigning the appropriate color value.

💡 Tip: You can find the complete list of these colors on the following link: https://www.w3schools.com/colors/colors_groups.asp