Adding colour swatches to Shopify collection pages using metafields.

product-card.liquid

{% comment %} Show color options {% endcomment %}
{%- if product_card_product.metafields.product_info.color.type == "list.color"  -%}
  <div class="color-options">
    {%- for color in product_card_product.metafields.product_info.color.value -%}
      <div class="color-options__item" style="background-color:{{color}};">&nbsp;</div>
    {%- endfor -%}
  </div>
{%- endif -%}