- Icon Monks
- Vue icons
Vue icons
5,518 free icon components for Vue 3 and Nuxt, each in six weights, tree-shakeable and fully typed.
Install
npm install @icon-monks/vue
Use an icon
<script setup>
import { House, Heart } from '@icon-monks/vue';
</script>
<template>
<House />
<Heart :size="32" color="crimson" weight="fill" />
</template>
Set defaults
<script setup>
import { provide } from 'vue';
import { IconContextKey } from '@icon-monks/vue';
provide(IconContextKey, { size: 24, weight: 'bold' });
</script>
Props
size, color, weight (thin, light, regular, bold, fill, duotone) and mirrored. Other attributes fall through to the <svg>.
Popular icons
house
magnifying-glass
gear
user
bell
heart
star
envelope
shopping-cart
calendar
trash
plus
x
check
arrow-right
download
lock
camera
Browse all 5,518 iconsBrowse by category
Frequently asked questions
Does it work with Nuxt?
Yes. The components render on the server and in the browser, so they work in Nuxt pages, layouts and components.
Does it support Vue 2?
The package targets Vue 3. For Vue 2 projects, use the web component or the SVG files.
Is it tree-shakeable?
Yes. Each icon is a separate module, so only the icons you import end up in your bundle.