Open Source JavaScript Icon Sets
Sort By:
JavaScript Icon Sets
View 160 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.
-
MongoDB Atlas runs apps anywhereMongoDB Atlas gives you the freedom to build and run modern applications anywhere—across AWS, Azure, and Google Cloud. With global availability in over 115 regions, Atlas lets you deploy close to your users, meet compliance needs, and scale with confidence across any geography.
-
Easily Host LLMs and Web Apps on Cloud RunRun frontend and backend services, batch jobs, host LLMs, and queue processing workloads without the need to manage infrastructure. Cloud Run gives you on-demand GPU access for hosting LLMs and running real-time AI—with 5-second cold starts and automatic scale-to-zero so you only pay for actual usage. New customers get $300 in free credit to start.
-
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
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. -
3
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. -
4
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. -
Try Google Cloud Risk-Free With $300 in CreditUse your credit across every product. Compute, storage, AI, analytics. When it runs out, 20+ products stay free. You only pay when you choose to.
-
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
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. -
7
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. -
8
Warhammer 40K Icon
Warhammer 40000 icons
Free to download Warhammer 40.000 icons as SVG/iconfont. Symbols and names belong to Games Workshop. -
9
font-logos
An icon font providing popular linux distro's logos
font-logos is an icon font containing logos of popular Linux distributions and other open-source software. All brand icons are trademarks of their respective owners and should only be used to represent the company or product to which they refer. Install the font by downloading and unpacking the latest release's zip manually or installing it from npm. -
Cut Data Warehouse Costs by 54%BigQuery delivers 54% lower TCO with exabyte scale and flexible pricing. Free migration tools handle the SQL translation automatically.
-
10
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. -
11
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. -
12
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. -
13
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. -
14
akar-icons-fonts
Akar icons library as icon fonts
A perfectly rounded icon library made for designers, developers, and pretty much everyone. Explore all of our icons at akaricons. -
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
sketch iconfont
This plugin helps you easily insert and manage icons from icon fonts
This plugin helps you easily insert and manage icons from icon fonts. Your teammates don't have your icon-fonts? don't worry now you can convert all icons with one command then share it. This plugin helps you easily insert and manage icons from icon fonts - such as FontAwesome, Ion or Material Design Icons - in your Sketch designs. The plugin itself has no font built-in. You will need to download and install the fonts you wish to use directly from the font publisher. The most popular ones, however, have been put into a bundle that you can easily download. -
17
styled-icons
Popular icon packs like Font Awesome, Material Design, and Octicons
styled-icons provides over 20,000 icons from the following icon packs as Styled Components, with full support for TypeScript types and tree-shaking / ES modules. Finally, you will need to have installed a version of styled-components at least version 4.1.0 or newer, as styled-icons depends on styled-components as a peer dependency. All icons are available for preview at the Icon Explorer. For the individual icon pack packages (@styled-icons/PACK), the icons are also importable individually - this is not possible with the uber-styled-icons package containing all the packs. Some icons natively have non-square dimensions - original dimensions are exported from the individual icon exports. All icons are exported as Styled Components, which means it is possible to utilize the Styled Components API. If you wish to style all icons at once, you can create a wrapper styled component that imparts a particular style to all icons contained within the wrapper by targeting the StyledIconBase. -
18
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. -
19
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. -
20
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. -
21
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+. -
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
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. -
24
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. -
25
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.
