About the Project

The features of this package include the following:

• 1000 icons in 6 different types
• Perfectly balance
• 24px grid-based
• Lightweight, powerful and easy to use

Installation

• Install Yarn package

yarn add vue3-iconsax

• Install NPM package

npm install vue3-iconsax

Usage

Global registration:

// main.js
import { VsxIcon } from "vue-iconsax";
const app = createApp(App);
// Dynamic icon component - Use PascalCase for iconName prop
app.component("VsxIcon", VsxIcon);
app.mount("#app");

// App.vue
<template>
  // Dynamic icon component - Use PascalCase for iconName prop
  <VsxIcon :iconName="iconName" color="blue" size="50" type="linear" />
</template>

<script>
export default {
  props:['iconName']
};
</script>

Local registration:

<template>
  <AaveIcon color="blue" size="50" type="linear" />
</template>

<script>
import { AaveIcon } from "vue3-iconsax";
export default {
  components: {
  AaveIcon
  },
};
</script>

Props

| Prop | Type | Default | Note | | ---------- | --------------------------------------------------- | -------------- | ------------------------------------------------------------------ | | color | string | currentColor | css color | | size | number string | 24px | size="24" or :size="24" | | type | Linear Outline TwoTone Bulk Broken Bold | Linear | icons styles | | iconName | string | | iconName is only required with vsx-icon tag (Dynamic icon imports) |