UNPKG

@iconscout/unicons

Version:

Ready to use font icons for your next project

108 lines (67 loc) 3.54 kB
# Unicons 1000+ Pixel-perfect vector icons and Iconfont for your next project. These icons are designed by [Iconscout](https://iconscout.com). ## Getting Started ### Using as a font It's easy to use Unicons on your website by just inserting following css. You can also download this repo and use the css from `css` folder. ```html <link rel="stylesheet" href="https://unicons.iconscout.com/release/v4.0.0/css/unicons.css" /> ``` And use the icons in your `body` as below. ```html <i class="uil uil-comments"></i> ``` ### Using as npm package You can easily install [Unicons](https://iconscout.com/unicons) using npm. ```bash npm install --save @iconscout/unicons ``` ### Using as an SVG If you're a designer then it's always great to have SVG files. You can download SVGs from [Official Unicons Website](https://iconscout.com/unicons) or [download Icondrop](https://iconscout.com/icondrop) to access these icons right into Sketch, Adobe Xd, Adobe Illustrator, and many more. ### Using in Flutter Framework There's a Flutter package created by [Pedro Lemos](https://github.com/pedrolemoz), avaliable in [pub.dev](https://pub.dev/packages/unicons), which can be easily used in your project. Just add the dependency in your `pubspec.yaml` file as following: ```yaml dependencies: unicons: ^1.0.0+2 ``` Then, run the command above: ```bash flutter pub get ``` Alternatively, your editor might support `flutter pub get`. Check the docs for your editor to learn more. Now, in your Dart code, import the package: ```dart import 'package:unicons/unicons.dart'; ``` ### Use with JS Frameworks We've created components for popular libraries like React, VueJS, React Native. You can head over to official GitHub Repo to know more. #### Line Style - For React: https://github.com/Iconscout/react-unicons - For VueJS: https://github.com/Iconscout/vue-unicons - For React Native: https://github.com/Iconscout/react-native-unicons #### Solid Style - For React: https://github.com/Iconscout/react-unicons-solid - For VueJS: https://github.com/Iconscout/vue-unicons-solid #### Monochrome Style - For React: https://github.com/Iconscout/react-unicons-monochrome ### More ways (Community supported) - [Vue-unicons](https://github.com/antonreshetov/vue-unicons) by [Anton Reshetov](https://github.com/antonreshetov) ## Roadmap - [x] Make React Components - [x] Adding Brand Icons - [x] Designing Solid Style - [ ] Designing Thin-line Style - [ ] Support for CSS Animations - [ ] Make SVG Sprite in which user can control different attributes such as stroke, fill, width, height and more. ## Contributing We will be happy to have community support for Unicons. Feel free to fork and create pull requests. We have given a small roadmap above so that you can help us build these features. ### Icon Requests We've created a thread at [Iconscout Community](https://discuss.iconscout.com/new-topic?title=Icon%20Request:%20%3Cicon%3E&body=Hey%20there,%20%3Cicon%3E%20will%20be%20great%20fit%20for%20Unicons.%20I%20would%20love%20to%20use%20it!&category=Unicons&tags=requests) where you can request for new icons. And we'll be happy to design them in upcoming weeks. ## License Unicons are Open Source icons and licensed under [Apache 2.0](https://www.apache.org/licenses/LICENSE-2.0.txt). You're free to use these icons in your personal and commercial project. We would love to see the attribution in your app's **about** screen, but it's not mandatory. ```html Unicons by <a href="https://iconscout.com/">Iconscout</a> ```