Icons
2,658Icons
Apache 2.0License
OutlineStyle
24×24Grid

IconPark Outline

2,658 Apache 2.0-licensed outline icons on a 24×24 grid. The 2,658 outline icons are drawn on a 24×24 grid with a clean, slightly rounded construction.

Browse IconPark Outline icons by category Compare libraries

About IconPark Outline

What IconPark Outline is

IconPark Outline is ByteDance's open-source icon library, built around an unusual idea: each icon exposes multiple theme properties — outline, fill, two-tone, and multi-colour — from a single component, with colours configurable at runtime rather than baked into the asset.

The 2,658 outline icons are drawn on a 24×24 grid with a clean, slightly rounded construction. What distinguishes IconPark is the component API: you can switch an icon between outline, filled, two-tone, and four-colour treatments with a prop, and set each colour independently.

IconStash indexes the complete IconPark Outline collection. You can search it alongside 27 other libraries, preview any icon at any size and colour, and export SVG, PNG, React JSX, Vue, CSS, or an SVG sprite without installing a package or creating an account.

Install and use IconPark Outline

React

npm install @icon-park/react

The official package ships each icon as a tree-shakeable component, so bundlers only include the icons you actually import. Open any IconPark Outline icon on IconStash and the Code tab shows that icon's exact import statement and JSX.

Plain SVG and other frameworks

You do not have to install anything. Every IconPark Outline page lets you copy the raw SVG markup and paste it inline, which avoids a dependency entirely and gives you full control over colour, size, and stroke width.

IconStash also exports PNG at six sizes, Vue and CSS snippets, and SVG sprites — all generated in the browser from the original vector.

When to choose IconPark Outline

Good fit

Products that need colour-configurable icons from a single asset, and teams using IconPark's React, Vue, or Svelte component packages.

Consider alternatives

If you only need static SVG, the component-based theming is unused complexity and Lucide is simpler. For filled icons, use the sibling IconPark Solid set.

Licensing

Apache 2.0 with an express patent grant. Free for commercial use without attribution.

IconPark Outline compared to other libraries

Popular IconPark Outline icons

Browse IconPark Outline by category

Frequently asked questions

What is IconPark Outline?

IconPark Outline is ByteDance's open-source icon library, built around an unusual idea: each icon exposes multiple theme properties — outline, fill, two-tone, and multi-colour — from a single component, with colours configurable at runtime rather than baked into the asset.

Is IconPark Outline free for commercial use?

Yes. IconPark Outline is released under Apache 2.0, which permits commercial use, modification, and distribution and includes an express patent grant from the licensor. Attribution is not required for ordinary use, but you should not use the icons in a way that implies the licensor endorses your product.

How do I use IconPark Outline icons in React?

Install the package with npm install @icon-park/react, then import icons as components. Every IconPark Outline page on IconStash shows the exact import statement and usage snippet for that specific icon in the Code tab, so you can copy working code without checking the docs. Tree-shakeable packages mean your bundler only includes the icons you actually import.

Can I download IconPark Outline icons as PNG?

Yes. Open any IconPark Outline icon on IconStash and use the Download PNG button to export at 16, 32, 64, 128, 256, or 512 pixels. The PNG is generated client-side from the original vector, so it stays crisp at every size. You can also copy the raw SVG markup, export a React component, or build an SVG sprite without installing anything.

What icon themes does IconPark support?

Four: outline, filled, two-tone, and multi-colour. Each is available from the same component via a theme prop, and the colours used by two-tone and multi-colour modes can be set independently at runtime. That means one imported icon can serve as an outline in one context and a coloured glyph in another.

How does IconPark Outline differ from IconPark Solid?

Outline is the 2,658-icon stroke-based set; Solid is the 1,970-icon filled set. They share the same component API, grid, and theming system, so you can mix them in one project without visual clash — use Outline for default state and Solid for active or selected state.

Explore other icon libraries