- Package
- Ionicons
- Category
- Uncategorized
Font Icon Library
Ionicons Search
515 icons
Browse by package, name, tag, class, or code point.
Logo Laravel
logo-laravel
- Package
- Ionicons
- Category
- Uncategorized
Logo Linkedin
logo-linkedin
- Package
- Ionicons
- Category
- Uncategorized
Logo Markdown
logo-markdown
- Package
- Ionicons
- Category
- Uncategorized
Logo Mastodon
logo-mastodon
- Package
- Ionicons
- Category
- Uncategorized
Logo Medium
logo-medium
- Package
- Ionicons
- Category
- Uncategorized
Logo Microsoft
logo-microsoft
- Package
- Ionicons
- Category
- Uncategorized
Logo No Smoking
logo-no-smoking
- Package
- Ionicons
- Category
- Uncategorized
Logo Nodejs
logo-nodejs
- Package
- Ionicons
- Category
- Uncategorized
Logo Npm
logo-npm
- Package
- Ionicons
- Category
- Uncategorized
Logo Octocat
logo-octocat
- Package
- Ionicons
- Category
- Uncategorized
Logo Paypal
logo-paypal
- Package
- Ionicons
- Category
- Uncategorized
Logo Pinterest
logo-pinterest
- Package
- Ionicons
- Category
- Uncategorized
Logo Playstation
logo-playstation
- Package
- Ionicons
- Category
- Uncategorized
Logo Pwa
logo-pwa
- Package
- Ionicons
- Category
- Uncategorized
Logo Python
logo-python
- Package
- Ionicons
- Category
- Uncategorized
Logo React
logo-react
- Package
- Ionicons
- Category
- Uncategorized
Logo Reddit
logo-reddit
- Package
- Ionicons
- Category
- Uncategorized
Logo Rss
logo-rss
- Package
- Ionicons
- Category
- Uncategorized
Logo Sass
logo-sass
- Package
- Ionicons
- Category
- Uncategorized
Logo Skype
logo-skype
- Package
- Ionicons
- Category
- Uncategorized
Logo Slack
logo-slack
- Package
- Ionicons
- Category
- Uncategorized
Logo Snapchat
logo-snapchat
- Package
- Ionicons
- Category
- Uncategorized
Logo Soundcloud
logo-soundcloud
- Package
- Ionicons
- Category
- Uncategorized
Logo Stackoverflow
logo-stackoverflow
- Package
- Ionicons
- Category
- Uncategorized
Logo Steam
logo-steam
- Package
- Ionicons
- Category
- Uncategorized
Logo Stencil
logo-stencil
- Package
- Ionicons
- Category
- Uncategorized
Logo Tableau
logo-tableau
- Package
- Ionicons
- Category
- Uncategorized
Logo Threads
logo-threads
- Package
- Ionicons
- Category
- Uncategorized
Logo Tiktok
logo-tiktok
- Package
- Ionicons
- Category
- Uncategorized
Logo Trapeze
logo-trapeze
- Package
- Ionicons
- Category
- Uncategorized
Logo Tumblr
logo-tumblr
- Package
- Ionicons
- Category
- Uncategorized
Logo Tux
logo-tux
- Package
- Ionicons
- Category
- Uncategorized
Logo Twitch
logo-twitch
- Package
- Ionicons
- Category
- Uncategorized
Logo Twitter
logo-twitter
- Package
- Ionicons
- Category
- Uncategorized
Logo Usd
logo-usd
- Package
- Ionicons
- Category
- Uncategorized
Logo Venmo
logo-venmo
- Package
- Ionicons
- Category
- Uncategorized
Logo Vercel
logo-vercel
- Package
- Ionicons
- Category
- Uncategorized
Logo Vimeo
logo-vimeo
- Package
- Ionicons
- Category
- Uncategorized
Logo Vk
logo-vk
- Package
- Ionicons
- Category
- Uncategorized
Logo Vue
logo-vue
- Package
- Ionicons
- Category
- Uncategorized
Logo Web Component
logo-web-component
- Package
- Ionicons
- Category
- Uncategorized
Logo Wechat
logo-wechat
- Package
- Ionicons
- Category
- Uncategorized
Logo Whatsapp
logo-whatsapp
- Package
- Ionicons
- Category
- Uncategorized
Logo Windows
logo-windows
- Package
- Ionicons
- Category
- Uncategorized
Logo Wordpress
logo-wordpress
- Package
- Ionicons
- Category
- Uncategorized
Logo X
logo-x
- Package
- Ionicons
- Category
- Uncategorized
Logo Xbox
logo-xbox
- Package
- Ionicons
- Category
- Uncategorized
Add Ionicons to your website or app
Add the library once, copy an icon from the results above, and include an accessible label when the icon communicates meaning.1. Load the icon library
<script type="module" src="https://cdn.jsdelivr.net/npm/[email protected]/dist/ionicons/ionicons.esm.js"></script>
Reference version: 8.1.0
2. Copy an icon
Use Copy class when you already have markup, or Copy HTML for a ready-to-paste element.
Code points are useful for CSS generated content and tools that work directly with icon fonts.
3. Keep icons accessible
Hide decorative icons from assistive technology. When an icon communicates meaning, pair it with visible text or an accessible label.
Confirm licensing and usage requirements with the library publisher before distributing a finished product.
Practical Notes
Icon Implementation Checklist
Icons work best when they support quick recognition without becoming the only way a user understands an action.Label important controls
Use visible text or accessible labels for buttons where the icon meaning may be ambiguous.
Keep style consistent
Mixing filled, outlined, sharp, and rounded icon families can make an interface feel uneven.
Load only what you need
Large icon fonts can cost performance. SVG sprites or subset fonts are better for focused interfaces.
Related References
Continue with nearby symbol, code, and web design resources.