Navigation

Shopware 6 Icons

Discover the many possibilities of Shopware 6 icons. Here you'll find a searchable overview of all icons, practical examples and guides for integrating them into your Shopware theme – plus how every icon looks in the 29 icon sets of ThemeWare®.

Browse all icons

All Shopware 6 icons

Shopware 6 provides two icon sets: Default (used in ThemeWare® themes for snippets & configuration) and Solid (bolder, only in your own Twig files). Pick a set and search by icon name. The same list holds the 29 icon sets of ThemeWare®: they swap the drawing behind the very same name.

* = covers every storefront icon. Without *, the set swaps the most common motifs (Essential Icons).
Embedding Download
Tip: To compare, click ⇆ on an icon to see it in every set – or pick "Compare all sets" or "Sets side by side" in the set selection.

Including Shopware 6 icons

You always include an icon by its name – truck, for example. That also holds with a ThemeWare® icon set: the set swaps the drawing behind the name, the name stays the one from Shopware. Names from the libraries themselves, such as fa-user, do not work.

Including icons in template files

To use icons in a TWIG template file, use the sw_icon tag: {% sw_icon 'icon-name' %}. Pick the icon you need, copy its name and add it as the argument.

Example:

{% sw_icon 'truck' %}

With a ThemeWare® icon set, sw_icon shows the drawing of the selected set as long as the configured scope covers the icon. Otherwise the Shopware icon stays in place.

In the USP bar and in snippets

Wherever ThemeWare® expects an icon name, for instance in the USP bar or in the badges, you enter the name in exactly the same way. heart is always the outline – for the filled heart use heart-fill, for the filled star star-fill.

Including icons in shopping experiences

To include Shopware 6 icons in shopping experiences, use a CMS element of the type "Text" or an HTML block and enter the <img> tag for the desired icon.

Recent Shopware versions

The path /bundles/storefront/assets/icon/default/[icon-name].svg no longer works in recent Shopware versions, because Shopware removed the storefront icons from the publicly accessible bundle folder.

It is best to upload the desired icon to your shop via the media management and click "Copy link". Insert the resulting link into your CMS element.

Example:

<img src="https://my-shop.com/media/32/8c/f1/1777296709/truck.svg" />

An image included this way is a fixed file – a ThemeWare® icon set does not swap it.

Downloading Shopware 6 icons

If you want to use the icons as graphics or via the Shopware 6 media management, you can download them as SVG – on GitHub in the following folder:

src/Storefront/Resources/app/storefront/dist/assets/icon/

The icons of the ThemeWare® icon sets are part of the theme and come from free libraries. Which one it is stands in the credit above the grid of every set. If you use icons outside your shop, the licence terms of that library apply – with Solar and Font Awesome (CC BY 4.0) that includes attribution.