agerix/iconify
2
0
Fork 0
mirror of https://github.com/iconify/iconify.git synced 2024-12-04 18:23:17 +00:00
Code Issues Releases Activity
362 Commits 10 Branches 34 Tags 17 MiB
TypeScript 77.8%
JavaScript 19.5%
HTML 2.2%
Svelte 0.4%
ed53add80d
Go to file
Vjacheslav Trushkin ed53add80d Add VSCode settings
2022-01-28 12:36:46 +02:00
.github Add GitHub Sponsors 2021-01-09 18:23:40 +02:00
.vscode Add VSCode settings 2022-01-28 12:36:46 +02:00
monorepo Fix executing NPM on Windows 2022-01-28 12:24:48 +02:00
packages Remove Lerna, use custom script instead 2022-01-27 21:16:43 +02:00
.editorconfig Move version 2 to a big monorepo 2020-04-28 12:47:35 +03:00
.gitignore Add VSCode settings 2022-01-28 12:36:46 +02:00
.prettierrc Move version 2 to a big monorepo 2020-04-28 12:47:35 +03:00
lerna.json Add debug_packages directory for packages for testing stuff 2020-12-18 11:02:03 +02:00
license.txt Add license files to packages that do not have them 2021-11-15 17:28:55 +02:00
package-lock.json Reorganize monorepo helpers, support multiple actions 2022-01-28 11:24:29 +02:00
package.json Reorganize monorepo helpers, support multiple actions 2022-01-28 11:24:29 +02:00
README.md Reorganize monorepo helpers, support multiple actions 2022-01-28 11:24:29 +02:00

README.md

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 100+ icon sets with more than 100,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 icon components for various frameworks and several packages that are reused by all those components.

Iconify icon components

Iconify icon components are not just yet another set of icon components. Unlike other icon components, Iconify icon components do not include icon data. They load icon data on demand from Iconify API.

Iconify API provides data for over 100,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.

If you are using typical icon set that is not a font, you still need to bundle all icons used in your application, even ones that visitor does not need.

Unlike icon fonts and components for various icon sets, Iconify icon components dynamically load icon data from Iconify API whenever it is needed.

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

Available packages

There are several Iconify components included in this repository:

Implementation Usage
SVG Framework HTML
React component React, Next.js
Vue 3 component Vue 3
Vue 2 component Vue 2
Svelte component Svelte, SvelteKit, Sapper
Ember component Ember

Other packages:

  • Iconify types - TypeScript types.
  • Iconify utils - common files used by various Iconify projects (including tools, API, etc...).
  • Iconify core - common files used by various components.
  • API redundancy - library for managing redundancies for loading data from API: handling timeouts, rotating hosts.
  • Library builder - build scripts for packages that do not require bundling, similar to tsup, but without bundler. Used by Utils, Core and API Redundancy packages. Builds ES and CommonJS modules, type definition files and updates exports in package.json.
  • React demo - demo for React component. Run npm start to start demo.
  • Next.js demo - demo for React component with Next.js. Run npm run build to build it and npm start to start demo.
  • Vue 3 demo - demo for Vue component. Run npm run dev to start demo.
  • Vue 2 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.
  • Svelte demo with Vite - demo for Svelte component using Vite. 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 (deprecated, use SvelteKit instead of Sapper).
  • SvelteKit demo - demo for SvelteKit, using Svelte component on the server and in the browser. Run npm run dev to start the demo.
  • Ember demo - demo for Ember component. Run npm run start to start demo.
  • Browser tests - unit tests for SVG framework. Run npm run build to build it. Open test.html in browser (requires HTTP server).

Installation

This monorepo used Lerna to manage packages, but due to few bugs in Lerna, it was replaced with custom manager.

To install dependencies in all packages, run

npm install

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 remove node_modules for all packages, run npm run clean.

If you want to re-install dependencies, run npm run reinstall.

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, 2021 Iconify OÜ