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.
You can download any icon of the pack directly from https://iconoir.com or get them from this repository.
The icons are also available via the iconoir
NPM package:
npm | Yarn | pnpm | Bun |
---|---|---|---|
npm i iconoir |
yarn add iconoir |
pnpm add iconoir |
bun add iconoir |
Example usage:
import Iconoir from 'iconoir/icons/iconoir.svg';
A React library is available under the name iconoir-react
.
For more details, see the package README.
A React Native library is available under the name iconoir-react-native
.
For more details, see the package README.
A Vue library is available under the name @iconoir/vue
.
For more details, see the package README.
A Flutter library is available under the name iconoir_flutter
.
For more details, see the package README.
Iconoir is happily part of Framer.
To start using the icons: On the top menu, Insert
> Graphics
> Iconoir
.
You can switch between icons from the right sidebar in the editor.
Import the CSS file:
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/gh/iconoir-icons/iconoir@main/css/iconoir.css"
/>
Here is an example in 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).
The library is available in the Figma community here.
To add Iconoir-swift
to your Xcode project, follow these steps:
- In Xcode, open your project and navigate to File > Swift Packages > Add Package Dependency...
- Enter the repository URL:
https://github.com/iconoir-icons/iconoir-swift.git
- Choose the branch or version you want to add, and click Next.
- Select the target where you want to use the package, then click Finish.
import UIKit
import Iconoir
let imageView = UIImageView(image: Iconoir.bell.asUIImage)
import SwiftUI
import Iconoir
struct ContentView: View {
var body: some View {
Iconoir.bell.asImage
.foregroundColor(.blue)
.font(.system(size: 24))
}
}