What it does
Ionicons is an MIT-licensed icon set used by Ionic and available independently. Its web component supports built-in and custom SVGs, filled, outline and sharp variants, and accessibility attributes.
Ionicons is included in Ionic Framework. Elsewhere, the repository provides loader-script instructions for adding its web component. Set the component’s name attribute to a symbol such as heart, heart-outline or heart-sharp. Only visible icons are fetched, rather than requesting every asset in the collection.
In Ionic, ios and md attributes can choose different variants by platform. Custom SVGs use the src attribute; those files must be reachable by the page and cannot contain scripts or event handlers. CSS color and font-size control appearance, while outline variants also support --ionicon-stroke-width.
For an icon-only button, put the accessible label on the button and hide the child icon from assistive technology with aria-hidden. A standalone meaningful icon can have its own aria-label. Logo icons do not have the outline and sharp alternatives of application symbols. The collection is free for personal and commercial use under MIT.
Strengths
- Loads visible icons on demand and accepts custom SVGs.
- Documents platform variants and accessible labelling.
Watch out for
- Logo icons lack outline and sharp variants.
- Custom SVGs must be free of scripts and event handlers.
Best for
- Ionic applications.
- Web components needing a consistent icon vocabulary.
Sources
- Ionicons Usage Guide (Oct 27, 2026)
- Ionicons (Oct 27, 2026)
- Ionicons: The MIT License (Oct 27, 2026)