All Projects → iconify → Iconify

iconify / Iconify

Licence: apache-2.0
Universal icon framework. One syntax for FontAwesome, Material Design Icons, DashIcons, Feather Icons, EmojiOne, Noto Emoji and many other icon sets (90+ icon sets, 80,000+ icons).

Programming Languages

typescript
32286 projects

Projects that are alternatives of or similar to Iconify

Small N Flat
svg icons on a 24px grid
Stars: ✭ 205 (-53.3%)
Mutual labels:  svg, icons
Mega Doodles Pack
🔥 Big vector pack with hand-drawn doodles for presentations, social media, blog posts and so on
Stars: ✭ 258 (-41.23%)
Mutual labels:  svg, icons
React Svg Buttons
React configurable animated svg buttons
Stars: ✭ 209 (-52.39%)
Mutual labels:  svg, icons
Webicon
Icon library
Stars: ✭ 190 (-56.72%)
Mutual labels:  svg, icons
Iconpark
🍎Transform an SVG icon into multiple themes, and generate React icons,Vue icons,svg icons
Stars: ✭ 4,924 (+1021.64%)
Mutual labels:  svg, icons
Free Gophers Pack
✨ This pack of 100+ gopher pictures and elements will help you to build own design of almost anything related to Go Programming Language: presentations, posts in blogs or social media, courses, videos and many, many more.
Stars: ✭ 2,343 (+433.71%)
Mutual labels:  svg, emoji
Vectorlogozone
3,000+ gorgeous SVG logos, perfect for your README or credits page
Stars: ✭ 239 (-45.56%)
Mutual labels:  svg, icons
Feathericon
simply generic vector icon collection - including sketch file, svg files, and font files.
Stars: ✭ 178 (-59.45%)
Mutual labels:  svg, icons
Ikonate
Fully customisable & accessible vector icons
Stars: ✭ 3,392 (+672.67%)
Mutual labels:  svg, icons
Devicon
Set of icons representing programming languages, designing & development tools
Stars: ✭ 4,536 (+933.26%)
Mutual labels:  svg, icons
Icons
Official open source SVG icon library for Bootstrap.
Stars: ✭ 5,735 (+1206.38%)
Mutual labels:  svg, icons
Pixo
Convert SVG icons into React components
Stars: ✭ 371 (-15.49%)
Mutual labels:  svg, icons
Richpath
💪 Rich Android Path. 🤡 Draw as you want. 🎉 Animate much as you can.
Stars: ✭ 2,259 (+414.58%)
Mutual labels:  svg, icons
Svelte Awesome
Awesome SVG icon component for Svelte JS, built with Font Awesome icons. Based on Justineo/vue-awesome
Stars: ✭ 193 (-56.04%)
Mutual labels:  svg, icons
Vue Eva Icons
Is a pack of more than 480 beautiful open source Eva icons as Vue components
Stars: ✭ 189 (-56.95%)
Mutual labels:  svg, icons
React Kawaii
Cute SVG React Components
Stars: ✭ 2,709 (+517.08%)
Mutual labels:  svg, icons
File Icon Vectors
A collection of file type icons in SVG format
Stars: ✭ 171 (-61.05%)
Mutual labels:  svg, icons
Blade Heroicons
A package to easily make use of Heroicons in your Laravel Blade views.
Stars: ✭ 173 (-60.59%)
Mutual labels:  svg, icons
Grayshift
A lightweight front-end component library for developing fast and powerful web interfaces.
Stars: ✭ 304 (-30.75%)
Mutual labels:  svg, icons
Bytesize Icons
Tiny style-controlled SVG iconset (101 icons, 12kb)
Stars: ✭ 3,662 (+734.17%)
Mutual labels:  svg, icons

What is Iconify?

Iconify is the most versatile icon framework.

  • Unified icon framework that can be used with any icon library.
  • Out of the box includes 80+ icon sets with more than 70,000 icons.
  • Embed icons in HTML with SVG framework or components for front-end frameworks.
  • Embed icons in designs with plug-ins for Figma, Sketch and Adobe XD.
  • Add icon search to your applications with Iconify Icon Finder.

For more information visit https://iconify.design/.

Iconify version 1

If you are looking for Iconify version 1, check out https://github.com/iconify/iconify/tree/iconify1

This repository contains the new version, completely rewritten using modern development process.

Iconify monorepo

This repository is a big monorepo that contains several implementations of Iconify icon framework.

There are two types of Iconify implementations:

  • Implementations that rely on icon packages.
  • Implementations that rely on Iconify API.

Implementations: without API

These Iconify implementations require the developer to provide icon data and expect that icon data to be included in the bundle.

Examples: Iconify for React, Iconify for Vue.

They are easy to use and do not require an internet connection to work, similar to other React/Vue components.

Implementations: with API

Iconify is designed to be easy to use. One of the main features is the Iconify API.

Iconify API provides data for over 70,000 icons! API is hosted on publicly available servers, spread out geographically to make sure visitors from all over the world have the fastest possible connection with redundancies in place to make sure it is always online.

Why is API needed?

When you use an icon font, each visitor loads an entire font, even if your page only uses a few icons. This is a major downside of using icon fonts. That limits developers to one or two fonts or icon sets.

Unlike icon fonts, Iconify implementations that use API do not load the entire icon set. Iconify only loads icons that are used on the current page.

This makes it possible to have an unlimited choice of icons!

Iconify API provides icon data to Iconify SVG framework and other implementations that rely on Iconify API.

Available packages

There are several Iconify implementations included in this repository:

Implementation Usage with API without API
SVG Framework HTML + +
React component React - +
React component with API React + +
Vue component Vue - +
Svelte component Svelte/Sapper - +

Other packages:

  • Iconify types - TypeScript types used by various implementations.
  • Iconify core - common files used by various implementations.
  • React demo - demo for React component. Run npm start to start demo.
  • React with API demo - demo for React component that loads icons from Iconify API. Run npm start to start demo.
  • Vue demo - demo for Vue component. Run npm run dev to start demo.
  • Svelte demo - demo for Svelte component. Run npm run dev to start demo.
  • Sapper demo - demo for Sapper, using Svelte component on the server and in the browser. Run npm run dev to start the demo.
  • Browser tests - unit tests for SVG framework. Run npm run build to build it. Open test.html in browser (requires HTTP server).

Legacy packages

Unfortunately Lerna does not support several versions of the same package. Because of that, some packages were moved from "packages" to "archive". This applies only to packages that were replaced by newer packages that aren't backwards compatible (and packages that rely on those packages).

Legacy packages:

Installation

This monorepo uses Lerna to manage packages.

First you need to install Lerna:

npm run install

To install dependencies in all packages, run

npm run bootstrap

This will install all dependencies and create symbolic links to packages.

If links stop working for some reason, run npm run link to fix links.

If you want to re-install dependencies, run npm run clean to clear all repositories (press "Y" to continue), then npm run bootstrap to install everything again.

Documentation

Documentation for all packages is available on Iconify documentation website:

Licence

Iconify is dual-licensed under Apache 2.0 and GPL 2.0 licence. You may select, at your option, one of the above-listed licences.

SPDX-License-Identifier: Apache-2.0 OR GPL-2.0

This licence does not apply to icons. Icons are released under different licences, see each icon set for details. Icons available by default are all licensed under some kind of open-source or free licence.

© 2020 Iconify OÜ

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].