---
title: "Free Icons for Shopify - SVG in Your Theme Assets"
product: "Streamline Icons, Illustrations and Elements"
url: /free-icons-for-shopify
canonical_url: "https://design.streamlinehq.com/free-icons-for-shopify"
summary: "Add icons to a Shopify theme as SVG assets you can style with CSS. 109,582 free Streamline icons, no sign up required, well under the 15KB limit."
---
# Add free SVG icons to your Shopify theme

> Add icons to a Shopify theme as SVG assets you can style with CSS. 109,582 free Streamline icons, no sign up required, well under the 15KB limit.
- **URL**: https://design.streamlinehq.com/free-icons-for-shopify

---

* The only icon system: massive, consistent sets
* Drawn in-house by one team of 8 icon designers
* Recolor to your brand in one click with SVG

[Access Pro Icons](https://www.streamlinehq.com/premium), [Start With Free Icons](https://www.streamlinehq.com/free)

## Get an icon in three steps

### Find the icons your store needs

Cart, shipping, returns, payment, support. Real-time search shows results as you type, across every family.

### Export as SVG

Shopify theme assets must be under 15KB. A Streamline icon is a few hundred bytes, so the limit never comes up.

### Upload and reference it

Add it under Assets in the code editor, then call it with the asset\_url filter, or inline\_asset\_content to style it with CSS.

## Core

The Helvetica of icons, on a 14px grid. Free and pro counts per style.

### Core

Core is the Helvetica of icons, stripped to its essential form with generous spacing. 998 free icons across 8 styles.

* **Core Line**: [998 free icons](https://www.streamlinehq.com/icons/core-line-free), [5,615 pro icons](https://www.streamlinehq.com/icons/core-line)
* **Core Solid**: [998 free icons](https://www.streamlinehq.com/icons/core-solid-free), [5,615 pro icons](https://www.streamlinehq.com/icons/core-solid)
* **Core Flat**: [998 free icons](https://www.streamlinehq.com/icons/core-flat-free), [5,615 pro icons](https://www.streamlinehq.com/icons/core-flat)
* **Core Gradient**: [998 free icons](https://www.streamlinehq.com/icons/core-gradient-free), [5,615 pro icons](https://www.streamlinehq.com/icons/core-gradient)
* **Core Duo**: [998 free icons](https://www.streamlinehq.com/icons/core-duo-free), [5,615 pro icons](https://www.streamlinehq.com/icons/core-duo-color)
* **Core Neon**: [998 free icons](https://www.streamlinehq.com/icons/core-neon-free), [5,615 pro icons](https://www.streamlinehq.com/icons/core-neon)
* **Core Pop**: [998 free icons](https://www.streamlinehq.com/icons/core-pop-free), [5,615 pro icons](https://www.streamlinehq.com/icons/core-pop-style)
* **Core Remix**: [998 free icons](https://www.streamlinehq.com/icons/core-remix-free), [5,615 pro icons](https://www.streamlinehq.com/icons/core-remix)

## Where Core gets used

### Where it is the wrong choice

Core Line contributes no personality by design, so a brand that needs the icons to carry identity will not get it here. At 64px and above the stripped-back construction starts to read as sparse rather than clean.

### Dashboards that should not have a point of view

Core is the Helvetica of icons: SaaS dashboards, admin panels, developer tools and settings screens, where the icons are infrastructure and the content is the thing. It works inside any design system without competing with it.

### Platforms other people build on

If third parties ship inside your product, an opinionated icon set becomes their problem as well as yours. Core stays neutral enough that a partner brand can sit next to it without a clash.

## Ultimate

The encyclopedia. Free and pro counts per style.

### Ultimate

1,000 free icons per set across 5 styles. Encyclopedic coverage, from common to rare icons. A neutral style that fits most use cases.

* **Ultimate Light**: [1,000 free icons](https://www.streamlinehq.com/icons/ultimate-light-free), [17,683 pro icons](https://www.streamlinehq.com/icons/streamline-light)
* **Ultimate Regular**: [1,000 free icons](https://www.streamlinehq.com/icons/ultimate-regular-free), [16,751 pro icons](https://www.streamlinehq.com/icons/streamline-regular)
* **Ultimate Bold**: [1,000 free icons](https://www.streamlinehq.com/icons/ultimate-bold-free), [18,541 pro icons](https://www.streamlinehq.com/icons/streamline-bold)
* **Ultimate Colors**: [1,000 free icons](https://www.streamlinehq.com/icons/ultimate-colors-free), [10,456 pro icons](https://www.streamlinehq.com/icons/streamline-colors)
* **Ultimate Duotone**: [1,000 free icons](https://www.streamlinehq.com/icons/ultimate-duotone-free), [10,935 pro icons](https://www.streamlinehq.com/icons/streamline-duotone)

## Where Ultimate gets used

### Where it is the wrong choice

Ultimate is rounded, which reads as approachable rather than precise. Medical devices, aerospace and audit software usually want sharp geometry, because austerity is the trust signal there. Below 14px it also gives way to a family drawn on a smaller grid.

### One system across every product surface

Ultimate is the safest default when a single icon set has to cover navigation, settings, onboarding and empty states without imposing a personality. Over 16,500 icons means coverage stops being the thing that blocks a release.

### Design systems serving several teams

Where a component library is used by more than one product team, mixing sources is the failure mode. Ultimate is built to be the one place everybody pulls from, so the icons still match two years and four teams later.

## Flex

Fluid curves, on a 14px grid. Free and pro counts per style.

### Flex

Flex is a fluid icon family inspired by nature's curves, more organic than Core but subtler than Plump. 499 free icons across 8 styles.

* **Flex Line**: [499 free icons](https://www.streamlinehq.com/icons/flex-line-free), [5,615 pro icons](https://www.streamlinehq.com/icons/flex-line)
* **Flex Solid**: [499 free icons](https://www.streamlinehq.com/icons/flex-solid-free), [5,615 pro icons](https://www.streamlinehq.com/icons/flex-solid-style)
* **Flex Flat**: [499 free icons](https://www.streamlinehq.com/icons/flex-flat-free), [5,615 pro icons](https://www.streamlinehq.com/icons/flex-flat-style)
* **Flex Gradient**: [499 free icons](https://www.streamlinehq.com/icons/flex-gradient-free), [5,615 pro icons](https://www.streamlinehq.com/icons/flex-gradient)
* **Flex Duo**: [499 free icons](https://www.streamlinehq.com/icons/flex-duo-free), [5,615 pro icons](https://www.streamlinehq.com/icons/flex-duo)
* **Flex Neon**: [499 free icons](https://www.streamlinehq.com/icons/flex-neon-free), [5,615 pro icons](https://www.streamlinehq.com/icons/flex-neon)
* **Flex Pop**: [499 free icons](https://www.streamlinehq.com/icons/flex-pop-free), [5,615 pro icons](https://www.streamlinehq.com/icons/flex-pop)
* **Flex Remix**: [499 free icons](https://www.streamlinehq.com/icons/flex-remix-free), [5,615 pro icons](https://www.streamlinehq.com/icons/flex-remix)

## Where Flex gets used

### Consumer products with a softer register

Flex is inspired by nature's curves, more organic than Core and subtler than Plump. It suits wellness, lifestyle and consumer SaaS, where the interface should feel considered rather than clinical.

### Feature callouts and selected states

Flex Solid is the answer where Flex Line gets fragile: primary actions, badges, tab bars, and photography-heavy layouts where an outline disappears into the image behind it.

## Works in your tools

* [Mac App](https://home.streamlinehq.com/plugins/download): Drag and drop icons directly into any app
* [Figma](https://www.figma.com/community/plugin/852192486284901337): Browse and insert icons without leaving Figma
* [Framer](https://www.framer.com/marketplace/plugins/core-icons-by-streamline/): Use icons natively in Framer projects
* [Webflow](https://webflow.com/apps/detail/streamline-icons): Add icons directly to Webflow sites
* [VS Code](https://marketplace.visualstudio.com/items?itemName=streamline.streamline-icons): Insert icons as SVG or JSX in editors
* [Lucid](https://lucid.co/marketplace/01f05f6d/streamline-icons-illustrations-emojis-and-elements): Add icons to your Lucidchart diagrams
* [Miro](https://miro.com/marketplace/streamline/): Drop icons into your Miro boards
* [Adobe Express](https://adobesparkpost.app.link/TR9Mb7TXFLb?addOnId=w165n33k3): Use icons in Adobe Express projects

## Get the full library with Pro

Free sets cover thousands of icons. Pro unlocks the full library across every family.

### Free: $0

* 109,582 icons
* Mandatory attribution
* All plugins, web app, MCP and API (limited)
* Adjust size, color and format

[Get started](https://www.streamlinehq.com/free)

### Pro subscription: $19 per month

* 333,032 pro icons on top
* Full resolution PNG exports
* 58 pro sets in 11 families
* All plugins, web app, MCP and API
* Pay monthly or yearly

[Get Pro](https://www.streamlinehq.com/pricing)

### One-time purchase: Lifetime

* Buy once, own forever
* Future assets included
* All source files as a ZIP
* All plugins, web app, MCP and API
* No renewal fees

[Get Lifetime](https://www.streamlinehq.com/lifetime)

## Inline the SVG and the theme can colour it

Referencing an asset with asset\_url puts the icon in an img tag, where your CSS cannot reach inside it. inline\_asset\_content renders the SVG into the page instead, so the shape inherits your theme colours the way text does.

That matters on a storefront more than most places, because merchants change palettes seasonally. An inlined icon follows the change; an image file has to be re-exported every time.

## One family across the whole storefront

We go deep. Streamline builds massive, complete icon sets designed to cover every use case you'll ever need. A store needs icons for trust badges, shipping, sizing, returns and support, and they all have to look related.

Pulling each from a different free set is how a checkout page ends up with four stroke weights in one row. Taking them from one family removes the problem before it starts.

## Frequently asked questions

Quick answers about using these icons.

### How do I add a custom SVG icon to a Shopify theme?

Open the code editor, add the SVG under Assets, then reference it in Liquid. asset\_url gives you a file URL for an img tag. inline\_asset\_content renders the SVG markup into the page, which is the one you want if the icon needs to take a colour from your CSS.

### What size can a Shopify asset be?

Theme assets must be under 15KB. That is a real constraint for photography and no constraint at all for icons, since a Streamline SVG is typically a few hundred bytes.

### Can I recolour icons to match my store?

Yes. Set the colour in Streamline before exporting, or inline the SVG in your theme and colour it with CSS, which lets one file serve a light and a dark section without a second export.

### Are these icons free to use commercially?

Yes, on both tiers. 109,582 icons across 34 families are free, with no sign up required, and the free tier asks for attribution, a credit link wherever the icons appear. [Pro and Lifetime](https://www.streamlinehq.com/pricing) remove that and unlock 333,032 pro icons. See [SVG icons](/svg-icons.md) for the format itself.