Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/egoist/vue-feather-icons
Simply beautiful open source icons as Vue functional components.
https://github.com/egoist/vue-feather-icons
Last synced: about 2 months ago
JSON representation
Simply beautiful open source icons as Vue functional components.
- Host: GitHub
- URL: https://github.com/egoist/vue-feather-icons
- Owner: egoist
- License: mit
- Created: 2017-08-04T04:52:12.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2023-02-19T08:10:55.000Z (over 1 year ago)
- Last Synced: 2024-04-08T17:15:14.663Z (about 2 months ago)
- Language: Vue
- Homepage: https://vue-feather-icons.egoist.dev/
- Size: 1.06 MB
- Stars: 593
- Watchers: 11
- Forks: 37
- Open Issues: 38
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Lists
- awesome-vue - vue-feather-icons - Simply beautiful open source icons as Vue functional components. (Components & Libraries / UI Components)
- awesome-vue - vue-feather-icons - Simply beautiful open source icons as Vue functional components. (Components & Libraries / UI Components)
- awesome-vue - vue-feather-icons - Simply beautiful open source icons as Vue functional components. (Components & Libraries / UI Components)
- awesome - egoist/vue-feather-icons - Simply beautiful open source icons as Vue functional components. (Vue)
- awesome-stars - vue-feather-icons
- my-awesome-stars - egoist/vue-feather-icons - Simply beautiful open source icons as Vue functional components. (Vue)
README
# vue-feather-icons
[](https://npmjs.com/package/vue-feather-icons) [](https://npmjs.com/package/vue-feather-icons) [](https://circleci.com/gh/egoist/vue-feather-icons/tree/master) [](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.dev
### 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
```
You can also set a `px` size directly by just passing an integer
```html
```
## 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.
Authored and maintained by egoist with help from contributors ([list](https://github.com/egoist/vue-feather-icons/contributors)).
> [egoist.dev](https://egoist.dev) · GitHub [@egoist](https://github.com/egoist) · Twitter [@poorlybatched](https://twitter.com/poorlybatched)