Resources
← All resources
IconsToolsFigmaWeb Design
Heroicons — 316 Free SVG Icons by the Makers of Tailwind CSS

About this resource

Heroicons is a free SVG icon library from Tailwind Labs, the makers of Tailwind CSS. The current collection includes 316 icons designed in a consistent visual style for interfaces, websites and digital products. Icons are available in multiple optimized variants: 24×24 Outline, 24×24 Solid, 20×20 Solid and 16×16 Solid. This makes it easy to choose the right level of detail for navigation, buttons, menus, tables, mobile interfaces and other UI contexts. The Heroicons website lets users search the full collection, copy SVG source directly and inline icons in HTML. Icon color can be controlled through CSS, making the set easy to integrate into design systems and Tailwind CSS workflows. Official `@heroicons/react` and `@heroicons/vue` packages provide each icon as an individual component. Designers can also access the official Figma file directly from the Heroicons website. Heroicons is especially useful for UI/UX designers, web designers and frontend developers looking for a compact, consistent set of essential interface icons without a paid subscription. The library is fully open source and released under the MIT License, allowing free use, modification and integration in personal and commercial projects.

Usage and licensing

Heroicons is released under the MIT License and may be used, modified and integrated into personal and commercial projects under the terms of the license.

Check the creator’s current terms before using this resource.

Similar resources