Qinuux Vue

Qinuux Vue – Installation

Welcome to Qinuux Vue, your go-to library for high-quality, scalable, and fully customizable icons. Whether you are a designer looking to download ready-to-use assets, or a developer wanting to integrate them directly into your Vue project, Qinuux makes the process seamless.

🎯 Quick Overview

Designers – Browse and download icons instantly from the icons library without installing anything.
Developers – Install our official qinuux-vue npm package for effortless integration into your codebase.
Customizable – Adjust size, color, stroke width, and other properties directly via props.
Scalable – Icons maintain perfect clarity at any resolution.
Consistent – Every icon follows strict design guidelines for visual harmony.

📦 Installation

Install Qinuux Vue using your preferred package manager:

# npm
npm i qinuux-vue

# yarn
yarn add qinuux-vue

# pnpm
pnpm add qinuux-vue

Once installed, import icons just like regular Vue components.

//You can try this!
<script lang="ts" setup>
import { ref } from "vue";
import HelloWorld from './components/helloworld.vue'
import { NPM, WhatsApp, Discord } from "qinuux-vue";

const active = ref(false)
</script>

<template>
    <a @click="active = !active">

    </a>
    <a>
    <WhatsApp class="whatsapp" :size="99" color="red" stroke-width="5" />
  </a>
    <h1>Vs</h1>
    <a><Discord class="discord" width="99" height="99" color="pink" stroke-width="4.9" />
    </a>
  <HelloWorld msg="Used (:size or width + height???)" />
</template>

⚙️ Props You Can Use


`size`	`number \| string`	`undefined`	Sets both `width` and `height`.
`color`	`string`	`currentColor`	Sets the icon stroke/fill color.
`class`	`string`	`""`	Custom CSS classes or Tailwind?.
`style`	`string \| object`	`undefined`	Apply inline styles.

Qinuux

🌐 Explore the Full Library