lucide-nuxt
lucide-nuxt
lucide-vue-next auto-imports for Nuxt 3 for the best DX with Lucide Icons.
Features
- 📝 Copy and paste from the lucide website without worrying about the import.
- 💌 Easy to setup, just one command!
Quick Setup
Install the module to your Nuxt application with one command:
npx nuxi module add lucide-nuxt
That's it! You can now use lucide-nuxt in your Nuxt app ✨
Usage
Search for an icon on https://lucide.dev/icons and click on copy Vue.

Paste into your template.
<template>
<HandHeart />
</template>
Configuration
You can change the prefix via the following code. In the example y use Lucide as the custom prefix.
export default defineNuxtConfig({
modules: ["lucide-nuxt"],
lucide: {
prefix: "Lucide",
},
});
<template>
<LucideCamera />
</template>
Contribution
Local development
# Install dependencies
npm install
# Generate type stubs
npm run dev:prepare
# Develop with the playground
npm run dev
# Build the playground
npm run dev:build
# Run ESLint
npm run lint
# Run Vitest
npm run test
npm run test:watch
# Release new version
npm run release
Related Packages
@aautcq/nuxt-iconify-fontawesome
Use Font Awesome icons with popular Nuxt modules Nuxt Icon and NuxtUI
2,279
0
@iconify-prerendered/vue-lucide
Lucide components for Vue. Designed for ease of use and high performance
6,560
112
Version History
| Version | Released | Vue | License |
|---|---|---|---|
| 1.2.2 | ^3.0 | MIT | |
| 1.2.1 | ^3.0 | MIT | |
| 1.2.0 | ^3.0 | MIT | |
| 1.1.0 | ^3.0 | MIT | |
| 1.0.0 | ^3.0 | MIT |