Open Source JavaScript Icon Sets
Sort By:
JavaScript Icon Sets
View 153 business solutionsBrowse free open source JavaScript Icon Sets and projects below. Use the toggles on the left to filter open source JavaScript Icon Sets by OS, license, language, programming language, and project status.
-
Enterprise-grade ITSM, for every businessFreshservice is an intuitive, AI-powered platform that helps IT, operations, and business teams deliver exceptional service without the usual complexity. Automate repetitive tasks, resolve issues faster, and provide seamless support across the organization. From managing incidents and assets to driving smarter decisions, Freshservice makes it easy to stay efficient and scale with confidence.
-
Our Free Plans just got better! | Auth0You asked, we delivered! Auth0 is excited to expand our Free and Paid plans to include more options so you can focus on building, deploying, and scaling applications without having to worry about your security. Auth0 now, thank yourself later.
-
1
Bootstrap Icons
Open source SVG icon library for Bootstrap
Free, high-quality, open-source icon library with over 1,600 icons. Include them any way you like, SVGs, SVG sprite, or web fonts. Use them with or without Bootstrap in any project. Bootstrap Icons are published to npm, but they can also be manually downloaded if needed. Bootstrap Icons are SVGs, so you can include them into your HTML in a few ways depending on how your project is setup. We recommend using a width: 1em (and optionally height: 1em) for easy resizing via font-size. Embed your icons within the HTML of your page (as opposed to an external image file). Here we’ve used a custom width and height. Use the SVG sprite to insert any icon through the <use> element. Use the icon’s filename as the fragment identifier (e.g., toggles is #toggles). SVG sprites allow you to reference an external file similar to an <img> element, but with the power of currentColor for easy theming. -
2
Open Weather Icons
Weather icon font and css themed icons
Weather icon font and CSS themed icons specially created for Open Weather Map API, are ready to be used in any project. Place the contents from the fonts and css folder in your project, assuming that your fonts are located under a ../fonts/ path relative to your CSS directory. The icons are displayed by using the i element and adding the base class owi and the icon class that you want, such as a owi owi-01d the code 01d is the icon code that you get from Open Weather Map. -
3
Primer Octicons
A scalable set of icons handcrafted by GitHub
This repository contains several libraries. Each of them is in the lib/ folder and gives access to Octicons on a different platform/language. The octicons node.js library is the main JavaScript library. With a JavaScript API that can be used in a variety of applications. Select the icon frames you want to commit. Make sure the frames are either 16x16 or 24x24 and that you've outlined all strokes. Select the branch you want to commit to. You can choose an existing branch or create a new branch. Press "Commit." The plugin will then export, commit, and push the selected icons to the branch you chose. If you chose to create a new branch, the plugin will give you a link to where you can start a new pull request with your branch. -
4
iX Icons
Icon web font library for @siemens/ix
Icon web font library for @siemens/ix. Using icons within your project. You need to install and load styling. -
Deliver secure remote access with OpenVPN.OpenVPN's products provide scalable, secure remote access — giving complete freedom to your employees to work outside the office while securely accessing SaaS, the internet, and company resources.
-
5
Feather
Simply beautiful open source icons
Feather is a collection of simply beautiful open source icons. Each icon is designed on a 24x24 grid with an emphasis on simplicity, consistency, and flexibility. At its core, Feather is a collection of SVG files. This means that you can use Feather icons in all the same ways you can use SVGs (e.g. img, background-image, inline, object, embed, iframe). Here's a helpful article detailing the many ways SVGs can be used on the web: SVG on the Web – Implementation Options. All elements that have a data-feather attribute will be replaced with SVG markup corresponding to their data-feather attribute value. See the API Reference for more information about feather.replace(). -
6
CoreUI Icons
Premium designed free icon set with marks in SVG, Webfont and raster
Premium-designed free icon set with marks in SVG, JavaScript, and Webfont formats. CoreUI Icons are beautifully crafted symbols for common actions and items. You can use them in your digital products for web or mobile apps. WOFF, SVG, TFF, and much more to make your development easier. Download our free package or buy pro. You gain SOLID, LINEAR and soon DUO-TONE style sets. Just browse our library to find out more. Multiple icons are grouped in categories like Nature, Transport, Interface, Food, Facilities, and many more, just browse our library to find out more. Not the exact shape? No worries. We have prepared some alternatives and keep on working on new ones. Just browse our library to find out more. -
7
Ikonate
Fully customisable & accessible vector icons
Ikonate are fully customizable & accessible*, well-optimized vector icons. To learn more about the project and generate the icons online, visit Ikonate. Customized SVG icons as stand-alone files (perfect for designers who don't want to edit code) Customised SVG sprite with an html demo. Customized html demo of the icons as inline SVG. To customise icons with CSS you need to use the icons as either inline SVG or SVG sprite. Ikonate is NOT accessible out of the box and will never be. We've done our best to follow the best accessibility practices while building this software, but it's your role to adjust it and make it truly accessible inside your project. E.g. all the titles and descriptions given to the icons should be treated as placeholders and changed in implementation depending on an actual role of each icon. In many cases, you may not need them altogether. -
8
React Native Vector Icons
Customizable Icons for React Native with full styling
Perfect for buttons, logos and nav/tab bars. Easy to extend, style and integrate into your project. If you want to use any of the bundled icons, you need to add the icon fonts to your Xcode project. For each platform (iOS/Android/Windows) you plan to use, follow one of the options for the corresponding platform. Upgrading this package often requires the font files linked to your projects to be updated as well. If the automatic linking works for you, running this again should update the fonts. You can either use one of the bundled icons supported or roll your own custom font. Since Icon builds on top of the Text component, most style properties will work as expected, you might find it useful to play around with background color, border width, border color, border radius, padding, margin, color, font size, etc. -
9
Evil Icons
Simple and clean SVG icon pack with the code to support Rails, Sprocke
Simple and clean SVG icon pack with the code to support Rails, Sprockets, Node.js, Gulp, Grunt and CDN. Free ‘plug and play’ set of SVG icons designed specifically for web projects. Available as a Ruby gem, a Node.js package and /Gulp plugins. Just use icon names with your templates and styles — and all the rest will be done automagically. Every icon has the .icon class and its modifier including the icon name. For example, the Facebook icon has the .icon--ei-sc-facebook modifier. In order to use the stylesheets, you have to add Sprockets to your application. We support IE 9+, Firefox, Chrome, Safari (desktop and mobile), Opera, Android 4+. -
Turn Your Content into Interactive Magic - For FreeTransform anything you share into an engaging digital experience - for free. Instantly convert your PDFs, slides, and files into dynamic, interactive sessions with built-in collaboration tools, activities, and real-time assessment. From teaching to training to team building, make every presentation unforgettable. Used by millions for education, business, and professional development.
-
10
Payment-icons
Payment / Ecommerce related svg icon packs
Payment-related svg icons for use in fonts or sprite sheets. The raw .svg output (from a mix of sketch and inkscape) is in the svg directory. The minified svg output is in the min dir. The easiest way to consume these icons is to npm install from github and use your favorite toolchain to build fonts or sprites. You'll need to use the svg like you do any other image asset. Exactly how will depend on what you're using in your build process. -
11
Simple Icons
SVG icons for popular brands
Over 2400 Free SVG icons for popular brands. Icons can be downloaded as SVGs directly from our website - simply click the download button of the icon you want, and the download will start automatically. Icons can be served from a CDN such as JSDelivr or Unpkg. Simply use the simple-icons npm package and specify a version in the URL. All icons are imported from a single file, where [ICON SLUG] is replaced by a capitalized slug. We highly recommend using a bundler that can tree shake such as webpack to remove the unused icon code. The icons are also available through our Packagist package. -
12
Vue Unicons
1000+ Pixel-perfect svg icons for your next project as Vue components
1000+ Pixel-perfect svg unicons for your next project as Vue components. Vue Unicons is open source project and completely free to use. A simple way to add the necessary icons and install them. You can configure the icons globally. Simply specify the required parameters during installation. No icons you need? No problem, you can add custom svg icons. Then we add the file path inside the plugins key in nuxt.config.js, and set mode: 'client' to make vue-unicons work only in a browser. -
13
drawthe.net
drawthe.net draws network diagrams dynamically from a text file
drawthe.net draws network diagrams dynamically from a text file describing the placement, layout and icons. Given a yaml file describing the hierarchy of the network and it's connections, a resulting diagram will be created. Complex network diagrams typically involve specific place of icons, connections and labels using a tool like Visio or OmniGraffle using a mouse and constantly zooming in and out for single-pixel placement. The goal behind drawthe.net, was to be able to describe the digram in a text file and have it rendered in SVG in the browser. I simply wanted to be able to draw network diagrams as fast as it could be done on a dry-erase board without using a mouse. Each icon and icon family may behave differently when the fill and stroke are applied, review the icon cut sheets to see the icons available for each family with the iconFill and iconStroke set. -
14
olicons
olicons is a completely open-source icon set with crafted for designer
olicons is a completely open-source icon set with crafted for designer and coder. You may use for any purpose, whether personal or commercial. Icons in olicons for immediate implementation to your apps or websites. The olicons will keep updating! -
15
react-fontawesome
Font Awesome React component
Font Awesome is the Internet's icon library and toolkit, used by millions of designers, developers, and content creators. With our new Icon Wizard, you can magically add a modifier – like circle-plus, slash, or even poop – to almost any Font Awesome icon. Available now to Font Awesome Pro subscribers. Font Awesome Sharp Solid, the first style in our new Sharp family, is ready to use when you need a special touch of class for your project! Read the announcement and see what's new in the 6.2 release. Font Awesome 6 makes it even easier to use icons where you want to. More plugins and packages to match your stack. Less time wrestling browser rendering. From the beginning, Font Awesome has been free and open source. And since we're creator-owned and operated, we get to make sure Font Awesome Free stays that way. We have more icons, services, and support in Pro. If you want them, you subscribe. No shenanigans. We won't sell your data, because we don't want to live in that world. -
16
vue-fontawesome
Font Awesome Vue component
Font Awesome is the Internet's icon library and toolkit, used by millions of designers, developers, and content creators. With our new Icon Wizard, you can magically add a modifier – like circle-plus, slash, or even poop – to almost any Font Awesome icon. Available now to Font Awesome Pro subscribers. We know the pain of wrangling icons on the internet. That's why in 2012, we created the first version of our open-source icons and toolkit. And with the help of our subscription plan Font Awesome Pro, we've built a lean icon-obsessed team who keep cranking out more icons, more styles, and more services for everyone. We have more icons, services, and support in Pro. If you want them, you subscribe. No shenanigans. We won't sell your data, because we don't want to live in that world, and we don't want to run that company. From the beginning, Font Awesome has been free and open source. And since we're creator-owned and operated, we get to make sure Font Awesome Free stays that way. -
17
Bootstrap-Iconpicker
A simple icon picker
A simple iconpicker for Bootstrap 3.x and 4.x. Please note that this project is for Bootstrap 3.x and 4.x, including Glyphicons in Bootstrap 3.x. Other icon fonts that support: Elusive Icons, Font Awesome, Ionicons, Map Icons, Material Design Icons, Octicons, Typicons, Weather Icons, and Flag Icons. The CDN is updated after the release is made public, which means that there is a delay between the publishing of a release and its availability on the CDN. Within the download you'll find the following directories and files, logically grouping common assets and providing both compiled and minified variations. -
18
Bytesize Icons
Tiny style-controlled SVG iconset (101 icons, 12kb)
Each icon is hand-coded along a 32x32 grid, and uses SVG stroke allowing for maximum style flexibility; meaning you can adjust the weight, color, size, and if you want the edges to be round or square. Either drop each icon inline directly in your page as-needed, or loaded them up via external .svg file and the use tag. You can then easily change the weight of the icon by changing stroke-width attribute. You can also change the shape of the line caps and the line joins with stroke-linecap and stroke-linejoin. This will change the style of the icons by making them rounded or squared off. All these stroke properties are also available to use in CSS. Since there is a 2px margin between the paths and viewBox, I recommend not having a stroke-width larger than 4px (or 12.5%). 4px might seems small but it's relative to the 32x32 grid. -
19
Cryptocoins
Vector/webfont icon pack of your favourite cryptocurrencies
Cryptocoins is the most complete free vector icon pack of your favorite cryptocurrencies. Overview of all included coins/icons. Check the HTML if you're not sure how to include the icons to your project. Don't forget that every icon is available as a separate SVG file (in SVG/ folder) as well. Available in Webfont & SVG format for taking advantage of small file sizes and unlimited scalability, Cryptocoins are perfect for usage on the web, right where they belong. Use them all or just the ones you need. There are many ways/formats how to use Cryptocoins. -
20
EMBL-EBI Icon fonts
A collection of functional and scientific icons for EMBL-EBI sites
Reference the fonts.css stylesheet automatically loads a range of icon fonts that you can use. Icons are added automatically through CSS using the :before feature in CSS, so they will appear before whatever piece of text you associate them with. To make this association, you need to include particular class and data-icon attributes in the relevant HTML element. This version brings the most user-facing changes in several years as we've added in far more "common" icons and simplified the font stack. -
21
Maki
A POI Icon Set
Maki is an icon set made for map designers. Maki includes icons for common points of interest like parks, museums, and places of worship. Each icon is available as a 15px by 15px SVG file. Maki is open-source and CC0 licensed. It's easy to use Maki with Mapbox Studio. Download the icons, then drag the SVGs into the Mapbox Studio style editor. Use the Icon Editor to customize the styling of your icon set by adding or removing icons, styling by groups, and more. Maki welcomes icon requests from people in need of point-of-interest icons. Open an issue to make a request, and make sure to provide the required information outlined in the issue template. Maki can't include an icon for everything, so we prioritize only the most common point of interest icons used in mapmaking. Every icon in Maki must pass the automated tests in tests/maki.test.js. -
22
Mikkro CMS
CMS minimal php mysql
A small simple CMS system which is built up according to how you name the tables in your database. For example if you have a table with pages for your website, and you want a menu, you create your page table in your database with a row called parent_select_menu, parent_select_menu will automaticly link to the id row in the menu table and create a dropdownlist with the name rows in the menu table, in this way you can also create submenus. You can also create radio buttons with name_radio_opt1_opt2, and a textarea will be created for blob fields. Every table must have "id, name, timestamp". A login table must exist. Mikkro CMS is using Tiny MCE http://www.tinymce.com/ And Silk icon set from http://www.famfamfam.com/ -
23
MkFont
Tool to create & export fonts from existing assets
MkFont is a free (libre) tool to create & export fonts from existing assets. Component-based workflow, with advanced features to nit-pick & tweak metrics in a non-destructive way! A powerful component & compositing system, allowing for clever automation and infinite possibilities. Code points are organized by categories & blocks, immediately accessible and search-able. Bind your imported files to glyphs, or edit them on the fly. Use your time where it matters. You can search for specific characters, but also names & attributes. The search can look for known character associations & relationships, too! MkFont respects your assets and allows for experimenting safely with different settings until you find the one that suits your needs. MkFont comes with a small tool that takes a text blurb to show you which group of letters are recurring – and create ligatures out of them. -
24
Replacements Icons
Replacement icons for popular apps in the style of macOS Big Sur
Download one of our free icon templates from the resources page. You just need to download the icon you want, find the app to update on Finder, select it and "File/Get Info" or "⌘-I" and drag and drop the downloaded .icns file to the new window. Download the template for Sketch, Figma, Pixelmator, Photoshop, Pixelmator or Illustrator from the Resources page. -
25
Warhammer 40K Icon
Warhammer 40000 icons
Free to download Warhammer 40.000 icons as SVG/iconfont. Symbols and names belong to Games Workshop.
