Heroicons

Free plan Web

What Heroicons is

Heroicons is a collection of SVG icons for user interfaces, available through its website. The site lists 316 icons, offers a search field, and links to a Figma file. The collection is also available through React and Vue libraries, with 24px outline and solid icons, plus 20px and 16px solid icons. The project README describes copying SVGs from the site and placing them inline in HTML, or installing the relevant library and importing icons individually as components. Both icon styles can be styled using the CSS color property. The listed plan is free, and includes the icons, MIT license, and React and Vue libraries; commercial use is permitted. The project currently accepts bug-fix contributions, but not new icons or support for additional frameworks. The MIT license provides the software as is, without warranty.

Who it suits

Heroicons suits interface designers and developers who want SVG assets or React and Vue components. Its Figma file and direct HTML usage also serve people working outside those libraries.

What it does well

316 icons with a site search field
React and Vue component libraries
SVGs can be copied into HTML
Figma file is linked
Commercial use is permitted

What to know first

No new icons or framework support accepted
MIT license provides no warranty

Plans

Plan	Billed and limits	Price
Heroicons	316 icons · MIT license · React and Vue libraries	Free

As heroicons.com lists them, read 11 Oct 2026. The maker's own page has the final word.

Verdict

Heroicons offers a searchable icon collection with several ways to use it in interface work. Its current contribution scope is limited to bug fixes.

Facts from Heroicons's own pages

Available styles and sizes: The React and Vue libraries include 24px outline and solid icons, plus 20px and 16px solid icons. · github.com, 11 Oct 2026
Contribution scope: The project README says contributions are currently limited to bug fixes and that it is not accepting new icons or support for other frameworks. · github.com, 11 Oct 2026
Figma: The site links to a Figma file for Heroicons. · heroicons.com, 11 Oct 2026
Icon count: The site lists 316 icons. · heroicons.com, 11 Oct 2026
Icon libraries: Heroicons offers React and Vue libraries. · heroicons.com, 11 Oct 2026
License: The site lists an MIT license for Heroicons. · heroicons.com, 11 Oct 2026
Purpose: Heroicons is a set of hand-crafted SVG icons for user interfaces. · heroicons.com, 11 Oct 2026
React integration: The README documents installing @heroicons/react and importing icons individually as React components. · github.com, 11 Oct 2026
Search: The site provides a search field to search all icons. · heroicons.com, 11 Oct 2026
Styling: The README says both icon styles can be styled through the CSS color property. · github.com, 11 Oct 2026
SVG usage: The project README says icons can be copied from the site and inlined directly into HTML. · github.com, 11 Oct 2026
Vue integration: The README documents installing @heroicons/vue and importing icons individually as Vue components. · github.com, 11 Oct 2026
Warranty: The MIT license provides the software as is without warranty. · github.com, 11 Oct 2026

Where Heroicons stands on Freedom251

Icon Libraries#22 of 46