Files
lucide/docs/guide/vue/index.md

43 lines
1.5 KiB
Markdown
Raw Permalink Normal View History

2025-10-10 13:01:50 +02:00
---
2025-10-14 15:29:55 +02:00
title: Overview
2025-10-10 13:01:50 +02:00
nextPage:
2025-10-14 15:29:55 +02:00
- getting-started
2025-10-10 13:01:50 +02:00
---
2025-10-14 15:29:55 +02:00
<script setup>
import OverviewLink from '../../.vitepress/theme/components/base/OverviewLink.vue'
import OverviewLinkGrid from '../../.vitepress/theme/components/base/OverviewLinkGrid.vue'
import { vueSidebar } from '../../.vitepress/sidebar/vue'
</script>
2025-10-10 13:01:50 +02:00
2025-10-14 15:29:55 +02:00
<img src="/package-logos/dark/lucide-vue.svg" alt="Lucide icon library for Vue applications." width="540" style="margin-bottom: 48px;"/>
2025-10-10 13:01:50 +02:00
2025-10-14 15:29:55 +02:00
# Lucide for Vue
2025-10-10 13:01:50 +02:00
2025-10-14 15:29:55 +02:00
Lucide provides a Vue icon component library that makes it easy to integrate icons into your Vue applications.
Each icon is available as a standalone Vue component, allowing for seamless integration and customization.
2025-10-10 13:01:50 +02:00
2025-10-14 15:29:55 +02:00
List of features:
- **Easy to Use**: Import icons as Vue components and use them directly in your Vue components with JSX.
- **Customizable**: Adjust size, color, and other properties via props.
- **Tree-shakable**: Only the icons you use are included in your final bundle
- **TypeScript Support**: Fully typed components for better developer experience.
2025-10-10 13:01:50 +02:00
2025-10-14 15:29:55 +02:00
## Overview
2025-10-10 13:01:50 +02:00
2025-10-14 15:29:55 +02:00
<OverviewLink href="/guide/vue/getting-started" title="Getting Started" desc="Learn how to get started with Lucide in your Vue project."/>
2025-10-10 13:01:50 +02:00
2025-10-14 15:29:55 +02:00
### Basics
{{''}}
2025-10-10 13:01:50 +02:00
2025-10-14 15:29:55 +02:00
<OverviewLinkGrid>
<OverviewLink v-for="item in vueSidebar[1].items" :key="item.link" :href="item.link" :title="item.text" :desc="item.desc"/>
</OverviewLinkGrid >
2025-10-10 13:01:50 +02:00
2025-10-14 15:29:55 +02:00
### Advanced
{{''}}
2025-10-10 13:01:50 +02:00
2025-10-14 15:29:55 +02:00
<OverviewLinkGrid>
<OverviewLink v-for="item in vueSidebar[2].items" :key="item.link" :href="item.link" :title="item.text" :desc="item.desc"/>
</OverviewLinkGrid >