# vue-feather-icons

> Simply beautiful open source icons as Vue functional components.

Latest version **5.1.0** (published 2020-08-05) · MIT license · 0 weekly downloads

## Install

```sh
npm install vue-feather-icons
pnpm add vue-feather-icons
yarn add vue-feather-icons
bun add vue-feather-icons
```

## Health

**Score 28/100 (F)** — status: abandoned.

Positive: has types package; esm support; no vulnerabilities; high quality score.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 5.1.0 |
| Published | 2020-08-05 |
| First published | 2017-08-04 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | separate (@types/vue-feather-icons) |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 2.4 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 592 |
| Author | egoist |
| Maintainers | rem |

## Links

- npm: https://www.npmjs.com/package/vue-feather-icons
- Repository: https://github.com/egoist/vue-feather-icons
- Homepage: https://github.com/egoist/vue-feather-icons#readme
- Issues: https://github.com/egoist/vue-feather-icons/issues
- npm.io page: https://npm.io/package/vue-feather-icons

## Dependencies (1)

- [babel-helper-vue-jsx-merge-props](https://npm.io/package/babel-helper-vue-jsx-merge-props.md) ^2.0.2

## Recent versions

- 5.1.0 (latest) — 2020-08-05
- 5.0.0 — 2019-07-10
- 4.22.0 — 2019-06-07
- 4.21.0 — 2019-05-24
- 4.10.0 — 2019-01-14
- 4.7.1 — 2018-05-14
- 4.7.0 — 2018-04-02
- 4.5.0 — 2017-12-31
- 0.1.1 — 2017-08-04
- 0.1.0 — 2017-08-04

## README

# vue-feather-icons

[![NPM version](https://img.shields.io/npm/v/vue-feather-icons.svg?style=flat)](https://npmjs.com/package/vue-feather-icons) [![NPM downloads](https://img.shields.io/npm/dm/vue-feather-icons.svg?style=flat)](https://npmjs.com/package/vue-feather-icons) [![CircleCI](https://circleci.com/gh/egoist/vue-feather-icons/tree/master.svg?style=shield)](https://circleci.com/gh/egoist/vue-feather-icons/tree/master)  [![donate](https://img.shields.io/badge/$-donate-ff69b4.svg?maxAge=2592000&style=flat)](https://github.com/egoist/donate)

## Install

```bash
yarn add vue-feather-icons
```

## Usage

```js
// Only import what you need!
import { AirplayIcon, AtSignIcon, ... } from 'vue-feather-icons'
```

See all icons and usage here: https://vue-feather-icons.egoist.sh

### Sizing

By default, icons will be sized based on the font size of the parent element.

You can set a custom size using the `size` attribute. 
For multiple based sizing, pass the desired multiple followed by an `x`.

```html
<activity-icon size="1.5x" class="custom-class"></activity-icon> 
```

You can also set a `px` size directly by just passing an integer

```html
<activity-icon size="25" class="custom-class"></activity-icon> 
```

## Tree shaking

By using ES imports like `import { AirplayIcon } from 'vue-feather-icons'` with [webpack + minifier](https://webpack.js.org/guides/tree-shaking/#minify-the-output) or Rollup, unused exports in this module will be automatically eliminated.

To make webpack tree shaking work without using any minifier, you can use the per-file icons from [`icons`](https://unpkg.com/vue-feather-icons/icons/) directory, e.g. `import AirplayIcon from 'vue-feather-icons/icons/AirplayIcon'`.

## Related

- [vue-bytesize-icons](https://github.com/egoist/vue-bytesize-icons)

## Contributing

1. Fork it!
2. Create your feature branch: `git checkout -b my-new-feature`
3. Commit your changes: `git commit -am 'Add some feature'`
4. Push to the branch: `git push origin my-new-feature`
5. Submit a pull request :D


## Author

**vue-feather-icons** © [egoist](https://github.com/egoist), Released under the [MIT](./LICENSE) License.<br>
Authored and maintained by egoist with help from contributors ([list](https://github.com/egoist/vue-feather-icons/contributors)).

> [egoist.moe](https://egoist.moe) · GitHub [@egoist](https://github.com/egoist) · Twitter [@_egoistlily](https://twitter.com/_egoistlily)

---
_Source: https://npm.io/package/vue-feather-icons · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
