Overview

Effortless Vue 3 Icon Component

• Made for Vite environments
• Usable with all official Icon Packs

Installation

npm i -D @steeze-ui/vue-icon

Usage

<script setup lang="ts">
  //import icon component
  import {Icon} from "@steeze-ui/vue-icon"

  //import as many icons from a Icon Pack
  import {Fire} from "@steeze-ui/heroicons"
</script>

<template>
  <!-- Set Icon Theme via the attribute -->
  <Icon :src=Fire theme="solid" size="24px" color="red"></Icon>
</template>

Documentation

Icon attributes

| Attribute | Default | Description | | --------- | ------- | ---------------------------------------------------------------------- | | src | - | (required) The source of a icon coming from an Icon Pack | | theme | default | Configure to use a Icon Theme if available (otherwise render default) | | size | 100% | Configures width and height | | * | - | Any html attribute that is valid (e.g aria-hidden, class or style) |

Icon Packs

For all available Icon Packs visit steeze-ui/icons

Development

This repo uses pnpm. To build a new version of the package just run:

pnpm install && pnpm package