All Projects → mehmetsagir → v-svg-icons

mehmetsagir / v-svg-icons

Licence: MIT license
Svg icons for VueJS.

Programming Languages

Vue
7211 projects
javascript
184084 projects - #8 most used programming language
HTML
75241 projects

Projects that are alternatives of or similar to v-svg-icons

Pd Select
vue components ,like ios 3D picker style,vue 3d 选择器组件,3D滚轮
Stars: ✭ 101 (+180.56%)
Mutual labels:  components, npm-package
react-windows-ui
Build Windows fluent UI apps using ReactJS. Provides a set of accessible, reusable, and composable React components that make it super easy to create websites and apps.
Stars: ✭ 383 (+963.89%)
Mutual labels:  components, npm-package
npmlint
[DEPRECATED] Lint your npm package
Stars: ✭ 57 (+58.33%)
Mutual labels:  npm-package
rescheme
JSON Rescheme project will help you change the JSON structure easily using declarative syntax
Stars: ✭ 16 (-55.56%)
Mutual labels:  npm-package
hsx
Static HTML sites with JSX and webpack (no React).
Stars: ✭ 15 (-58.33%)
Mutual labels:  components
djb2a
DJB2a non-cryptographic hash function
Stars: ✭ 31 (-13.89%)
Mutual labels:  npm-package
torchx
TorchX is a universal job launcher for PyTorch applications. TorchX is designed to have fast iteration time for training/research and support for E2E production ML pipelines when you're ready.
Stars: ✭ 165 (+358.33%)
Mutual labels:  components
hydra-js
DOES NOT WORK WITH VERSIONS > 0.10.0 - A simple library to help you build node-based identity providers that work with Hydra.
Stars: ✭ 17 (-52.78%)
Mutual labels:  npm-package
useCustomHooks
📦 npm package containing a set of custom hooks for your next React project.
Stars: ✭ 12 (-66.67%)
Mutual labels:  npm-package
front-matter-manipulator
A utility for parsing and manipulating documents with Front Matter
Stars: ✭ 25 (-30.56%)
Mutual labels:  npm-package
titanium-vue
Use Vue.js to easily create native mobile apps with Axway Appcelerator Titanium.
Stars: ✭ 45 (+25%)
Mutual labels:  npm-package
youtube-playlist
❄️ Extract links, ids, and names from a youtube playlist
Stars: ✭ 73 (+102.78%)
Mutual labels:  npm-package
ansicolor
A JavaScript ANSI color/style management. ANSI parsing. ANSI to CSS. Small, clean, no dependencies.
Stars: ✭ 91 (+152.78%)
Mutual labels:  npm-package
tsstyled
A small, fast, and simple CSS-in-JS solution for React.
Stars: ✭ 52 (+44.44%)
Mutual labels:  components
ionic3-start-theme
Ionic 3 Start Theme with 10 Pages, mock data, providers samples, Storage, Http and more...
Stars: ✭ 130 (+261.11%)
Mutual labels:  components
ts-ci
🚀 A starter for TS projects meant to be published on NPM.
Stars: ✭ 282 (+683.33%)
Mutual labels:  npm-package
vue-mui
Mobile UI elements for Vue 2.0
Stars: ✭ 16 (-55.56%)
Mutual labels:  components
react-microsoft-login
Microsoft services authorization with React.
Stars: ✭ 65 (+80.56%)
Mutual labels:  npm-package
sdk-js
Viblo Javascript SDK
Stars: ✭ 17 (-52.78%)
Mutual labels:  npm-package
validid
A Javascript library to validate ID card numbers of China, Taiwan, Hong Kong and South Korea
Stars: ✭ 37 (+2.78%)
Mutual labels:  npm-package

v-svg-icons

Svg icons for VueJS.
Türkçe README dosyası için tıklayın!

Downloads Downloads Version License

Getting Started

These instructions will get you a copy of the component up and running on your local machine.

Installing

You can install v-svg-icons component by npm

npm i v-svg-icons

After download, v-svg-icons will be ready to use in your vue.js applications

Usage

  • Export the V-svg-icons component to the main.js file
import icons from "v-svg-icons";
  • Register v-svg-icons component with any name you want
Vue.component("icon", icons);

After this step, it can be used by all registered components in your project by tag name.

  • To use icons, you must specify the name of the icon you want with the name parameter inside the tag.
<icon name="arrow-up">
  • You can specify the width and height values as in the example.
    The default width and height values for all icons are 50px.
<icon name="arrow-up" size="60px" />
  • You can use the "color" parameter to change the color of the icons.
<icon name="arrow-up" color="black" />
<icon name="arrow-up" color="#000" />
<icon name="arrow-up" color="rgba(0, 0, 0, .2)" />
  • You can use the name of the icon as the class name for additional styling operations.
<icon name="arrow-up" />
<style>
    .arrow-up{
        fill: green;
        background: red;
        width: 150px;
        height: 150px;
    }
</style>

You can apply all the changes that can be made for svg as in the example.

Versioning

We use GitHub for versioning.

Authors

License

Licensed under the MIT license, see LICENSE for details.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].