Vue

@dev.icons/vue exports every icon as a Vue 3 component. Works with <script setup>, the Options API, Nuxt, and Vite SSR.

Install

npm install @dev.icons/vue

Usage

<script setup lang="ts">
import { _Vue as VueLogo, Nextjs } from "@dev.icons/vue";
</script>

<template>
  <VueLogo :size="48" />
  <Nextjs :size="48" alt="Next.js" />
</template>

Monochrome variants

Import from the /mono subpath:

<script setup lang="ts">
import { _Vue as VueLogo } from "@dev.icons/vue/mono";
</script>

<template>
  <VueLogo :size="48" />
</template>

Monochrome icons use currentColor, so they inherit the parent’s text color.

Props

Prop	Type	Default	Description
size	string | number	"1em"	Sets both width and height
color	string	"currentColor"	Sets the root fill. Visible on monochrome icons.
alt	string	none	Accessible name, rendered as an SVG <title>
mirrored	boolean	false	Flips the icon horizontally (scale(-1, 1))

Other attributes (class, style, aria-*, listeners) fall through to the root <svg>.

Nuxt

There is no Nuxt module. Import icons in your components as usual. They render on the server without extra config.

Tree-shaking

Named imports are ESM-first and fully tree-shakeable.

import { Nextjs } from "@dev.icons/vue";