2018-06-17 13:18:42 +02:00
# BoxIcons
[![GitHub issues ](https://img.shields.io/github/issues/atisawd/boxicons.svg )](https://github.com/atisawd/boxicons/issues)
[![Twitter ](https://img.shields.io/twitter/url/https/github.com/atisawd/boxicons.svg?style=social )](https://twitter.com/intent/tweet?text=Wow:& url=https%3A%2F%2Fgithub.com%2Fatisawd%2Fboxicons)
[![Donate ](https://img.shields.io/badge/donate-paypal-blue.svg?style=flat-square )](https://paypal.me/atisawd)
_High Quality web friendly icons_
2018-07-03 08:48:00 +02:00
'Boxicons' is a carefully designed open source iconset with 700+ icons. It's crafted to look enrich your website/app experience.
2018-06-26 10:49:48 +02:00
2018-07-04 06:00:56 +02:00
_Announcing Boxicons v1.5.1!_
2018-06-26 10:49:48 +02:00
2018-07-03 08:48:00 +02:00
Solid icons have been added with a seperate logos category
2018-06-26 10:49:48 +02:00
You can check out the detailed documentation [here ](https://boxicons.com/get-started )
2018-06-17 13:18:42 +02:00
## Installation
To install via npm, simply do the following:
```bash
$ npm install boxicons --save
```
2018-06-23 11:53:43 +02:00
import the module
2018-06-17 13:18:42 +02:00
2018-06-23 11:53:43 +02:00
```javscript
import 'boxicons/css/boxicons.css';
```
2018-06-17 13:18:42 +02:00
## Usage
2018-06-30 22:10:38 +02:00
### Using via CSS
2018-06-17 13:18:42 +02:00
1. Include the stylesheet on your document's `<head>`
```html
< head >
2018-06-17 13:31:12 +02:00
< link rel = "stylesheet" href = "boxicons.min.css" >
2018-06-17 13:18:42 +02:00
< / head >
```
Instead of installing you may use the remote version
```html
< head >
< link rel = "stylesheet"
2018-07-04 06:00:56 +02:00
href="https://cdn.jsdelivr.net/npm/boxicons@1.5.1/css/boxicons.min.css">
2018-06-17 13:18:42 +02:00
<!-- or -->
< link rel = "stylesheet"
2018-07-04 06:00:56 +02:00
href="https://unpkg.com/boxicons@1.5.1/css/boxicons.min.css">
2018-06-17 13:18:42 +02:00
< / head >
```
2018-07-03 08:48:00 +02:00
2. To use an icon on your page, add a class 'bx' and seperate class with the icons name with a prefix 'bx-' for regular icons , 'bxs-' for solid icons and 'bxl-' for logos:
2018-06-17 13:18:42 +02:00
```html
< i class = "bx bx-hot" > < / i >
2018-07-03 08:48:00 +02:00
< i class = "bx bxs-hot" > < / i >
< i class = "bx bxl-facebook-square" > < / i >
2018-06-17 13:18:42 +02:00
```
[Check out all the icons here! ](https://boxicons.com )
2018-06-30 22:10:38 +02:00
2018-06-17 13:18:42 +02:00
## License
2018-06-29 22:00:13 +02:00
[You can read the license here! ](https://boxicons.com/get-started#license )
2018-06-17 13:18:42 +02:00
## Contributing
Pull requests are the way to go here. I apologise in advance for the slow action on pull requests and issues.
2018-06-23 11:53:43 +02:00
Caught a mistake or want to contribute to the documentation? [Edit this page on Github ](https://github.com/atisawd/boxicons/blob/master/README.md )