Iconoir

An open source icons library with 1300+ icons, supporting React, React Nati...

README

Iconoir


What is Iconoir?


Iconoir is an open-source library with 1300+ unique SVG icons, designed on a 24x24 pixels grid. No premium icons, no email sign-up, no newsletters.

Browse at iconoir.com →





Basic Usage


You can download any icon of the pack directly from https://iconoir.com or get them from this repository.

Additionally, the icons are available via the iconoir NPM package:
  1. ```bash
  2. yarn add iconoir
  3. # or
  4. npm i iconoir
  5. ```

Example usage:
  1. ```js
  2. import Iconoir from 'iconoir/icons/iconoir.svg'
  3. ```

React


A React library is available to install under the name iconoir-react. For more details, see the package README.

React Native


A React Native library is available to install under the name iconoir-react-native. For more details, see the package README.

Flutter


A Flutter library is available to install under the name iconoir_flutter. For more details, see the package README.

Framer


Iconoir is happily part of Framer now. To start using the icons: On the top menu,Insert > Graphics > Iconoir.
You can switch between icons from the right sidebar in the editor.

CSS


Import the CSS File:

  1. ```html
  2. <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/iconoir-icons/iconoir@main/css/iconoir.css">
  3. ```

Here is an example in HTML:

  1. ```html
  2. <i class="iconoir-hand-brake"></i>
  3. ```
The class must always be "iconoir-" and then the name of the icon. You can find the names of the icons here.

The icons are display: inline-block and default to the current font size. You can control this
by adjusting the ::before styles of the element (which is where the icons are added as a mask).

Figma


The library is available in the Figma community here.

Swift Package


To add Iconoir-swift to your Xcode project, follow these steps:

1. In Xcode, open your project and navigate to File > Swift Packages > Add Package Dependency...
2. Enter the repository URL: https://github.com/iconoir-icons/iconoir-swift.git
3. Choose the branch or version you want to add, and click Next.
4. Select the target where you want to use the package, then click Finish.

UIKit


  1. ```swift
  2. import UIKit
  3. import Iconoir

  4. let imageView = UIImageView(image: Iconoir.bell.asUIImage)
  5. ```

SwiftUI


  1. ```swift
  2. import SwiftUI
  3. import Iconoir

  4. struct ContentView: View {
  5.     var body: some View {
  6.         Iconoir.bell.asImage
  7.             .foregroundColor(.blue)
  8.             .font(.system(size: 24))
  9.     }
  10. }
  11. ```

License


MIT License