---
title: "Liquid filters: placeholder_svg_tag"
description: Generates an HTML `<svg>` tag for a given placeholder name.
api_name: liquid
source_url:
  html: https://shopify.dev/docs/api/liquid/filters/placeholder_svg_tag
  md: https://shopify.dev/docs/api/liquid/filters/placeholder_svg_tag.md
---

# placeholder\_​svg\_​tag

```oobleck
string | placeholder_svg_tag
```

returns [string](https://shopify.dev/docs/api/liquid/basics#string)

Generates an HTML `<svg>` tag for a given placeholder name.

Accepts the following placeholder names:

| Outline illustrations | Color illustrations |
| - | - |
| * `product-1`
* `product-2`
* `product-3`
* `product-4`
* `product-5`
* `product-6`
* `collection-1`
* `collection-2`
* `collection-3`
* `collection-4`
* `collection-5`
* `collection-6`
* `lifestyle-1`
* `lifestyle-2`
* `image` | - `product-apparel-1`
- `product-apparel-2`
- `product-apparel-3`
- `product-apparel-4`
- `collection-apparel-1`
- `collection-apparel-2`
- `collection-apparel-3`
- `collection-apparel-4`
- `hero-apparel-1`
- `hero-apparel-2`
- `hero-apparel-3`
- `blog-apparel-1`
- `blog-apparel-2`
- `blog-apparel-3`
- `detailed-apparel-1` |

```liquid
{{ 'collection-1' | placeholder_svg_tag }}
```

## Output

```html
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 525.5 525.5"><path d="M439.9 310.8c-.2.2-.1.5.1.7l13.2 8.7c.1.1.2.1.3.1.2 0 .3-.1.4-.2.2-.2.1-.5-.1-.7l-13.2-8.7c-.3-.2-.6-.1-.7.1z"/><path d="M463.4 235c1.1-9.4-1-18.6-5.1-21.6-1.7-1.2-3.6-1.3-5.4-.3l-.3.3-6.1-9.8-.1-.1-.8-8.1c-.2-1.9-1.7-3.3-3.6-3.3h-33c-1.6-33-14-75.8-44-75.9h-.1c-7.8 0-14.9 3.1-21.1 9.3-12.5 12.5-21 38.1-22.3 66.5h-20.7v-2.5c0-1.5-1.2-2.7-2.7-2.7h-3.8c-1.5 0-2.7 1.2-2.7 2.7v2.5H288c-1.9 0-3.4 1.4-3.6 3.3l-.8 8.4-5.9 9.5c-.1-.1-.3-.3-.5-.3-.8-.2-2.2-.3-3.6.8-.4.3-.7.6-1.1 1.1-8.5 9.5-6.5 32.6-.8 51.2h-34.5c.1-2.1.2-4.6.4-7.3.6-10.3 1.3-23.1.1-30.3-1.7-10.1-8.9-21.5-13.3-26.6-3.9-4.5-9.3-10.8-11.1-12.9 6.2-4 9.6-9.6 10.1-16.6v-.6c.3-3-.4-7.1-2.8-9.7-1.5-1.7-3.4-2.5-5.7-2.5h-39.6c-.3-11.5-6.3-23-19.3-23-4.3 0-8.2 1.7-11.4 4.5l-.2-.1c0 .1-.1.2-.1.4-4.5 4.2-7.4 10.8-7.6 18.3h-34.9c-2.3 0-4.3.8-5.7 2.5-2.3 2.6-3.1 6.7-2.8 9.7v.6c.5 7 3.9 12.6 10.1 16.6-1.9 2.2-7.3 8.4-11.1 12.9-5.4 6.3-11.9 17.3-13.3 26.6-2 12.9-.8 23 .2 32 .9 7.8 1.7 14.6.3 21.6-.8 1.7-1.7 3.6-2.4 5.6-3.2 8.4-4.4 18.9-3.6 23.5.7 3.9 4.3 6.7 8.9 8.3H62.8c-.6 0-1 .4-1 1V389c0 .6.4 1 1 1h59.7c.2.4.4.8.5 1.2 1.1 2.4 2.2 5 3.5 8.2.1.2.2.5.3.7 2.3 5.2 7.5 8.8 13.5 8.8h171.3c6 0 11.2-3.6 13.5-8.8v-.1l.3-.6c1.3-3.2 2.5-5.9 3.5-8.3.2-.4.4-.8.5-1.2H442c.9 0 1.7-.5 2.1-1.3.4-.8.3-1.7-.2-2.4l-8.4-10.8c-3-3.8-7.4-6-12.3-6h-53v-30.5c0-.3-.1-.5-.3-.7 6.3-.4 13.3-1.6 21-4 7.8-2.4 14.7-5.7 20.9-9.5H452c1.7 0 3.4-.7 4.5-2s1.7-3 1.5-4.7l-4.2-42.4c0-.1-.1-.3-.1-.4 5.8-13.2 9.3-27.2 9.7-40.5.1.4.1.3 0 .3zm-9.4-20.2c1.1-.6 2.2-.6 3.2.2 1.9 1.4 3.5 5 4.2 9.7-1.5-1.6-3.8-2-5.7-2.3l-1.5-.3c-1.4-.3-2.2-1-2.5-2.1-.3-1 0-2.2.7-3.3l1 1.6c.2.3.5.5.8.5.2 0 .4 0 .5-.2.5-.3.6-.9.3-1.4l-1.4-2.2c.2-.1.3-.1.4-.2zm-2.8 0c-1.5 1.7-2 3.8-1.5 5.7.5 1.8 1.9 3 4 3.5.5.1 1.1.2 1.6.3 3.1.6 5.1 1.1 5.5 3.8.1.5.5.8.9.8.1 3-.2 6.4-.9 9.8-1.9 8.8-4.6 17.3-8.2 25.5l-5.7-56.1 4.3 6.7zm-50.1-7.5h8.3l3.1 27.6c.1.5-.1.9-.4 1.2-.3.3-.7.5-1.2.5h-11.4c-.5 0-.9-.2-1.2-.5s-.4-.8-.4-1.2l3.2-27.6zm10.2-.4l-.1-.7c-.1-.5-.5-.9-1-.9h-10.1c-.5 0-.9.4-1 .9l-.1.7v-7.7
```

## Rendered output

### class

```oobleck
string | placeholder_svg_tag: string
```

Specify the `class` attribute for the `<svg>` tag.

```liquid
{{ 'collection-1' | placeholder_svg_tag: 'custom-class' }}
```

## Output

```html
<svg class="custom-class" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 525.5 525.5"><path d="M439.9 310.8c-.2.2-.1.5.1.7l13.2 8.7c.1.1.2.1.3.1.2 0 .3-.1.4-.2.2-.2.1-.5-.1-.7l-13.2-8.7c-.3-.2-.6-.1-.7.1z"/><path d="M463.4 235c1.1-9.4-1-18.6-5.1-21.6-1.7-1.2-3.6-1.3-5.4-.3l-.3.3-6.1-9.8-.1-.1-.8-8.1c-.2-1.9-1.7-3.3-3.6-3.3h-33c-1.6-33-14-75.8-44-75.9h-.1c-7.8 0-14.9 3.1-21.1 9.3-12.5 12.5-21 38.1-22.3 66.5h-20.7v-2.5c0-1.5-1.2-2.7-2.7-2.7h-3.8c-1.5 0-2.7 1.2-2.7 2.7v2.5H288c-1.9 0-3.4 1.4-3.6 3.3l-.8 8.4-5.9 9.5c-.1-.1-.3-.3-.5-.3-.8-.2-2.2-.3-3.6.8-.4.3-.7.6-1.1 1.1-8.5 9.5-6.5 32.6-.8 51.2h-34.5c.1-2.1.2-4.6.4-7.3.6-10.3 1.3-23.1.1-30.3-1.7-10.1-8.9-21.5-13.3-26.6-3.9-4.5-9.3-10.8-11.1-12.9 6.2-4 9.6-9.6 10.1-16.6v-.6c.3-3-.4-7.1-2.8-9.7-1.5-1.7-3.4-2.5-5.7-2.5h-39.6c-.3-11.5-6.3-23-19.3-23-4.3 0-8.2 1.7-11.4 4.5l-.2-.1c0 .1-.1.2-.1.4-4.5 4.2-7.4 10.8-7.6 18.3h-34.9c-2.3 0-4.3.8-5.7 2.5-2.3 2.6-3.1 6.7-2.8 9.7v.6c.5 7 3.9 12.6 10.1 16.6-1.9 2.2-7.3 8.4-11.1 12.9-5.4 6.3-11.9 17.3-13.3 26.6-2 12.9-.8 23 .2 32 .9 7.8 1.7 14.6.3 21.6-.8 1.7-1.7 3.6-2.4 5.6-3.2 8.4-4.4 18.9-3.6 23.5.7 3.9 4.3 6.7 8.9 8.3H62.8c-.6 0-1 .4-1 1V389c0 .6.4 1 1 1h59.7c.2.4.4.8.5 1.2 1.1 2.4 2.2 5 3.5 8.2.1.2.2.5.3.7 2.3 5.2 7.5 8.8 13.5 8.8h171.3c6 0 11.2-3.6 13.5-8.8v-.1l.3-.6c1.3-3.2 2.5-5.9 3.5-8.3.2-.4.4-.8.5-1.2H442c.9 0 1.7-.5 2.1-1.3.4-.8.3-1.7-.2-2.4l-8.4-10.8c-3-3.8-7.4-6-12.3-6h-53v-30.5c0-.3-.1-.5-.3-.7 6.3-.4 13.3-1.6 21-4 7.8-2.4 14.7-5.7 20.9-9.5H452c1.7 0 3.4-.7 4.5-2s1.7-3 1.5-4.7l-4.2-42.4c0-.1-.1-.3-.1-.4 5.8-13.2 9.3-27.2 9.7-40.5.1.4.1.3 0 .3zm-9.4-20.2c1.1-.6 2.2-.6 3.2.2 1.9 1.4 3.5 5 4.2 9.7-1.5-1.6-3.8-2-5.7-2.3l-1.5-.3c-1.4-.3-2.2-1-2.5-2.1-.3-1 0-2.2.7-3.3l1 1.6c.2.3.5.5.8.5.2 0 .4 0 .5-.2.5-.3.6-.9.3-1.4l-1.4-2.2c.2-.1.3-.1.4-.2zm-2.8 0c-1.5 1.7-2 3.8-1.5 5.7.5 1.8 1.9 3 4 3.5.5.1 1.1.2 1.6.3 3.1.6 5.1 1.1 5.5 3.8.1.5.5.8.9.8.1 3-.2 6.4-.9 9.8-1.9 8.8-4.6 17.3-8.2 25.5l-5.7-56.1 4.3 6.7zm-50.1-7.5h8.3l3.1 27.6c.1.5-.1.9-.4 1.2-.3.3-.7.5-1.2.5h-11.4c-.5 0-.9-.2-1.2-.5s-.4-.8-.4-1.2l3.2-27.6zm10.2-.4l-.1-.7c-.1-.5-.5-.9-1-.9h-10.1c-.5 0
```

## Rendered output