Icons

SVG Icons can be rendered using the icon.liquid snippet, courtesy of the Polaris Shopify Icons library.

Usage

{% render 'icon' with 'cart' %}
{% render 'icon' with 'chevron-right' %}
{% render 'icon' with 'twitter' %}

.with-icon utility class

To render SVG icons inline with text, use the .with-icon utility class:

Add-to-cart example

<button class="with-icon">
  Add to cart
  {% render 'icon' with 'chevron-right' %}
</button>

Accordion example

<details class="with-accordion">
  <summary class="with-icon">
    Lorem ipsum
    {% render 'icon' with 'chevron-right' %}
  </summary>
  ...
</details>