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.
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:
- ```bash
- yarn add iconoir
- # or
- npm i iconoir
- ```
Example usage:
- ```js
- import Iconoir from 'iconoir/icons/iconoir.svg'
- ```
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:
- ```html
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/iconoir-icons/iconoir@main/css/iconoir.css">
- ```
Here is an example in HTML:
- ```html
- <i class="iconoir-hand-brake"></i>
- ```
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
- ```swift
- import UIKit
- import Iconoir
- let imageView = UIImageView(image: Iconoir.bell.asUIImage)
- ```
SwiftUI
- ```swift
- import SwiftUI
- import Iconoir
- struct ContentView: View {
- var body: some View {
- Iconoir.bell.asImage
- .foregroundColor(.blue)
- .font(.system(size: 24))
- }
- }
- ```
License
MIT License