mirror of
https://github.com/lucide-icons/lucide.git
synced 2026-09-03 09:39:20 +02:00
67 lines
2.2 KiB
Markdown
67 lines
2.2 KiB
Markdown
|
---
|
||
|
|
title: Overview
|
||
|
|
nextPage:
|
||
|
|
- getting-started
|
||
|
|
---
|
||
|
|
|
||
|
|
<script setup>
|
||
|
|
import OverviewLink from '../../.vitepress/theme/components/base/OverviewLink.vue'
|
||
|
|
import OverviewLinkGrid from '../../.vitepress/theme/components/base/OverviewLinkGrid.vue'
|
||
|
|
import { lucideStaticSidebar } from '../../.vitepress/sidebar/static'
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<!--@include: ../../../docs/images/package-logos/lucide.svg -->
|
||
|
|
|
||
|
|
# Lucide Static Assets
|
||
|
|
|
||
|
|
Static assets and utilities for Lucide icons that work without JavaScript frameworks. This package provides multiple formats including individual SVG files, SVG sprites, icon fonts, and Node.js utilities for server-side rendering and static site generation.
|
||
|
|
|
||
|
|
**What you can accomplish:**
|
||
|
|
|
||
|
|
- Use individual SVG files as images or CSS background images
|
||
|
|
- Implement icon fonts for CSS-based icon systems
|
||
|
|
- Create SVG sprites for efficient icon loading in static sites
|
||
|
|
- Import SVG strings in Node.js applications and server-side rendering
|
||
|
|
- Build static websites and applications without JavaScript framework dependencies
|
||
|
|
|
||
|
|
This package includes the following implementations of Lucide icons:
|
||
|
|
|
||
|
|
- Individual SVG files
|
||
|
|
- SVG sprite
|
||
|
|
- Icon font files
|
||
|
|
- A JavaScript library exporting SVG strings
|
||
|
|
|
||
|
|
## Overview
|
||
|
|
|
||
|
|
<OverviewLinkGrid>
|
||
|
|
<OverviewLink v-for="item in lucideStaticSidebar[0].items.slice(1)" :key="item.link" :href="item.link" :title="item.text" :desc="item.desc"/>
|
||
|
|
</OverviewLinkGrid>
|
||
|
|
|
||
|
|
### SVG Files & Sprite
|
||
|
|
{{''}}
|
||
|
|
|
||
|
|
<OverviewLinkGrid>
|
||
|
|
<OverviewLink v-for="item in lucideStaticSidebar[1].items" :key="item.link" :href="item.link" :title="item.text" :desc="item.desc"/>
|
||
|
|
</OverviewLinkGrid >
|
||
|
|
|
||
|
|
### Icon Font
|
||
|
|
{{''}}
|
||
|
|
|
||
|
|
<OverviewLinkGrid>
|
||
|
|
<OverviewLink v-for="item in lucideStaticSidebar[2].items" :key="item.link" :href="item.link" :title="item.text" :desc="item.desc"/>
|
||
|
|
</OverviewLinkGrid >
|
||
|
|
|
||
|
|
### Javascript modules
|
||
|
|
{{''}}
|
||
|
|
|
||
|
|
<OverviewLinkGrid>
|
||
|
|
<OverviewLink v-for="item in lucideStaticSidebar[3].items" :key="item.link" :href="item.link" :title="item.text" :desc="item.desc"/>
|
||
|
|
</OverviewLinkGrid >
|
||
|
|
|
||
|
|
### Resources
|
||
|
|
{{''}}
|
||
|
|
|
||
|
|
<OverviewLinkGrid>
|
||
|
|
<OverviewLink v-for="item in lucideStaticSidebar[4].items" :key="item.link" :href="item.link" :title="item.text" :desc="item.desc"/>
|
||
|
|
</OverviewLinkGrid >
|