https://github.com/TerryMooreII/vue-zondicons
Vue.js component for accessing Zondicon svg icons
https://github.com/TerryMooreII/vue-zondicons
svg svg-icons tailwinds vue vuejs zondicons
Last synced: 5 months ago
JSON representation
Vue.js component for accessing Zondicon svg icons
- Host: GitHub
- URL: https://github.com/TerryMooreII/vue-zondicons
- Owner: TerryMooreII
- Created: 2018-11-08T00:42:51.000Z (about 7 years ago)
- Default Branch: master
- Last Pushed: 2018-12-07T02:15:38.000Z (about 7 years ago)
- Last Synced: 2025-07-07T12:05:53.583Z (5 months ago)
- Topics: svg, svg-icons, tailwinds, vue, vuejs, zondicons
- Language: Vue
- Size: 212 KB
- Stars: 19
- Watchers: 1
- Forks: 3
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- awesome-vue - vue-zondicons - Vue.js component for accessing Zondicon svg icons (UI Components [🔝](#readme))
- awesome-vue - vue-zondicons - Vue component for the beautiful [Zondicon](http://www.zondicons.com/icons.html) svg icons (Components & Libraries / UI Components)
- awesome-vue - vue-zondicons ★4 - Vue component for the beautiful [Zondicon](http://www.zondicons.com/icons.html) svg icons (UI Components / Icons)
- awesome-vue - vue-zondicons - Vue component for the beautiful [Zondicon](http://www.zondicons.com/icons.html) svg icons (UI Components / Icons)
README
# vue-zondicons
## Easily add Zondicon icons to your vue web project
**Installation**
```
npm install --save vue-zondicons
```
**To Use**
In your `main.js` Vue file add the following
```
import Zondicon from 'vue-zondicons';
Vue.component('Zondicon', Zondicon);
```
Browse Zondicons on the [Zondicon website](http://www.zondicons.com/icons.html) then add the name of the icon to the `icon` attribute
```javascript
```
You can also pass css classes to the Zondicon `svg` element
Note: `fill-content` and `text-red` are from the Tailwinds CSS library and `vue-zondicons` doesnt come with any css.
```javascript
```
**Note**
The icon `filter` has been changed to `filter-icon` since `filter` is a registered keyword in Vuejs and will throw errors.
## Project setup
```bash
npm install
```
## Development setup
clone this repo
```bash
npm install # Install dependancies
./scripts/make-icons.sh # download zondicons from zondicon repo and generate vue components
npm build # Build package for npm
npm publish
```
## Pull Request
Pull Requests are always welcome :)
License: MIT