How To Create Color Swatches for Product Variants in Shopify (Dawn Theme)

  • September 26, 2021
  • ramzan
  • 1 min read

Copy Below Code and replace with Line: 202, 203, 204 of Sections/main-product.liquid

{% if product.variants[forloop.index0].metafields.color.values and option.name == 'Color' %}
  <label for="{{ section.id }}-{{ option.name }}-{{ forloop.index0 }}" style="background-color: {{product.variants[forloop.index0].metafields.color.values}}">
    &nbsp;
  </label>
{% else %}
  <label for="{{ section.id }}-{{ option.name }}-{{ forloop.index0 }}">
    {{ value }}
  </label>
{% endif %} 

Try Shopify free for 14 days