Merge branch 'main' of https://github.com/lucide-icons/lucide into icon-usage-context

feat(icons): added graph-hub icon (#4974 )
* feat(icons): added split-circles icon * chore(icons): added cluster tag to `split-circles` * refactor(icons): renamed `split-circles` to `hub-circles` * refactor(icons): renamed `hub-circles` to `graph-hub` * Apply batched suggestions from code review Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> * Fix duplicate 'tags' key in graph-hub.json Removed duplicate 'tags' key in graph-hub.json. --------- Co-authored-by: Eric Fennis <eric.fennis@gmail.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
2026-11-11 13:28:19 +00:00 · 2026-10-19 15:01:32 +02:00 · 2026-10-19 14:37:34 +02:00 · 2026-10-19 14:28:50 +02:00 · 2026-10-19 12:08:22 +02:00 · 2026-10-19 12:07:56 +02:00
107 changed files with 5157 additions and 1112 deletions
@@ -0,0 +1,12 @@
+[
+  "fix",
+  "feat",
+  "perf",
+  "refactor",
+  "test",
+  "style",
+  "docs",
+  "ci",
+  "build",
+  "chore"
+]
@@ -0,0 +1,103 @@
+name: PR title
+
+on:
+  pull_request_target:
+    types:
+      - opened
+      - reopened
+      - synchronize
+      - edited
+
+permissions: {}
+
+concurrency:
+  group: pr-title-${{ github.event.pull_request.number }}
+  cancel-in-progress: true
+
+jobs:
+  generate-pr-title:
+    name: Generate PR Title
+    # Skip when a maintainer has opted out by adding the "Keep PR title" label,
+    # and on manual edits so they are not reverted straight away.
+    if: github.repository == 'lucide-icons/lucide' &&
+      github.event.action != 'edited' &&
+      !contains(github.event.pull_request.labels.*.name, 'Keep PR title')
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      pull-requests: write # Required to edit the PR title
+
+    steps:
+      #  We check out the main branch of the main repository for security reasons.
+      #  The script only reads its input from the environment, so it never runs
+      #  any code from the (untrusted) pull request.
+      - uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
+        with:
+          repository: lucide-icons/lucide
+          fetch-depth: 0
+      - uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
+        with:
+          node-version-file: 'package.json'
+
+      - name: Get changed files
+        id: changed-files
+        uses: tj-actions/changed-files@9426d40962ed5378910ee2e21d5f8c6fcbf2dd96 # v47.0.6
+        with:
+          # The checkout is the base branch, so the PR head commit isn't available locally.
+          use_rest_api: true
+
+      - name: Generate PR title
+        id: generate
+        run: |
+          NEW_TITLE="$(node ./scripts/generatePullRequestTitle.mts)"
+          {
+            echo "new_title<<PR_TITLE_EOF"
+            echo "$NEW_TITLE"
+            echo "PR_TITLE_EOF"
+          } >> "$GITHUB_OUTPUT"
+        env:
+          ADDED_FILES: ${{ steps.changed-files.outputs.added_files }}
+          CHANGED_FILES: ${{ steps.changed-files.outputs.all_changed_and_modified_files }}
+          CURRENT_TITLE: ${{ github.event.pull_request.title }}
+
+      - name: Update PR title
+        if: steps.generate.outputs.new_title != ''
+        run: gh pr edit "$PR_NUMBER" --title "$NEW_TITLE"
+        env:
+          GH_TOKEN: ${{ github.token }}
+          PR_NUMBER: ${{ github.event.pull_request.number }}
+          NEW_TITLE: ${{ steps.generate.outputs.new_title }}
+
+  # Runs after the title is generated: an edit made with `GITHUB_TOKEN` does not
+  # trigger new workflow runs, so a separate workflow would lint the old title.
+  # The lint action fetches the current title through the API.
+  lint-pr-title:
+    name: PR Title Lint
+    needs: generate-pr-title
+    if: ${{ !cancelled() }}
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      pull-requests: read # Required to read the PR title
+
+    steps:
+      # Checks out the base branch, so the allowed types can't be changed by the PR.
+      - uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
+
+      - name: Read conventional commit types
+        id: commit-types
+        run: |
+          {
+            echo "types<<TYPES_EOF"
+            jq -r '.[]' .github/conventional-commit-types.json
+            echo "TYPES_EOF"
+          } >> "$GITHUB_OUTPUT"
+
+      - uses: amannn/action-semantic-pull-request@48f256284bd46cdaab1048c3721360e808335d50 # v6.1.1
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          types: ${{ steps.commit-types.outputs.types }}
+          requireScope: true
+          ignoreLabels: |
+            bot
@@ -1,36 +0,0 @@
-name: Linting PR title
-
-on:
-  pull_request:
-    types:
-      - opened
-      - edited
-      - reopened
-
-permissions:
-  contents: read
-  pull-requests: read # Required to read the PR title
-
-jobs:
-  lint-pr-title:
-    name: PR Title Lint
-    runs-on: ubuntu-latest
-    steps:
-      - uses: amannn/action-semantic-pull-request@48f256284bd46cdaab1048c3721360e808335d50 # v6.1.1
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-        with:
-          types: |
-            fix
-            feat
-            perf
-            refactor
-            test
-            style
-            docs
-            ci
-            build
-            chore
-          requireScope: true
-          ignoreLabels: |
-            bot
@@ -10,6 +10,9 @@ on:
      - packages/shared/**
      - tools/build-icons/**
      - tools/rollup-plugins/**
+      - integrations/lucide-svelte/**
+      - package.json
+      - pnpm-workspace.yaml
      - pnpm-lock.yaml

 permissions:
@@ -63,3 +66,22 @@ jobs:

      - name: Typecheck
        run: pnpm --filter @lucide/svelte typecheck
+
+  integration:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
+      - uses: pnpm/action-setup@ea17c68df8912ef543352723c149a84f56e3d413 # v6.1.0
+      - uses: actions/setup-node@820762786026740c76f36085b0efc47a31fe5020 # v7.0.0
+        with:
+          cache: 'pnpm'
+          node-version-file: 'package.json'
+
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile
+
+      - name: Install Chromium
+        run: pnpm --filter @lucide/integration-svelte-vite exec playwright install --with-deps chromium
+
+      - name: Run integration checks
+        run: pnpm test:integrations:svelte
@@ -22,6 +22,7 @@ integrations/**/__screenshots__
 integrations/**/.output
 integrations/**/.nitro
 integrations/**/.nuxt
+integrations/**/.svelte-kit
 outlined
 lucide-font
 packages/**/src/icons/*.js
@@ -1,4 +1,5 @@
 pnpm-lock.yaml
+.github/conventional-commit-types.json

 # docs examples
 docs/**/examples/
@@ -29,6 +30,7 @@ integrations/**/__screenshots__
 integrations/**/.output
 integrations/**/.nitro
 integrations/**/.nuxt
+integrations/**/.svelte-kit

 # lucide-svelte
 packages/svelte/src/icons/*.svelte
@@ -68,6 +68,12 @@ export default defineConfig({
            new URL('./theme/components/overrides/VPCarbonAds.vue', import.meta.url),
          ),
        },
+        {
+          find: /^.*\/VPNavBarSearch\.vue$/,
+          replacement: fileURLToPath(
+            new URL('./theme/components/overrides/VPNavBarSearch.vue', import.meta.url),
+          ),
+        },
        {
          find: '~/.vitepress',
          replacement: fileURLToPath(new URL('./', import.meta.url)),
@@ -125,6 +131,14 @@ export default defineConfig({
    editLink: {
      pattern: 'https://github.com/lucide-icons/lucide/edit/main/docs/:path',
    },
+    search: {
+      provider: 'algolia',
+      options: {
+        appId: 'R7KKMCPXOB',
+        apiKey: 'dd3101054267d35fb28f49c42715f1aa',
+        indexName: 'lucide',
+      },
+    },
    carbonAds: {
      code: 'CWYIC53U',
      placement: 'lucidedev',
@@ -228,5 +228,24 @@
    ],
    "source": "https://github.com/GyeongHoKim/lucide-lit",
    "documentation": "https://github.com/GyeongHoKim/lucide-lit/blob/main/README.md"
+  },
+  {
+    "name": "lucide-jte",
+    "description": "Implementation of Lucide icons for jte (Java Template Engine).",
+    "icon": "/framework-logos/java.svg",
+    "shields": [
+      {
+        "alt": "Latest Stable Version",
+        "src": "https://img.shields.io/github/v/release/sgruendel/lucide-jte",
+        "href": "https://github.com/sgruendel/lucide-jte/releases"
+      },
+      {
+        "alt": "Maven Central",
+        "src": "https://img.shields.io/maven-central/v/io.github.sgruendel/lucide-jte.svg",
+        "href": "https://central.sonatype.com/artifact/io.github.sgruendel/lucide-jte"
+      }
+    ],
+    "source": "https://github.com/sgruendel/lucide-jte",
+    "documentation": "https://github.com/sgruendel/lucide-jte/blob/main/README.md"
  }
 ]
@@ -1,7 +1,19 @@
 import { PageData } from 'vitepress';

+/**
+ * Mirrors the notices in the repo's LICENSE file, which is bumped by hand — keep the
+ * year here in step with it.
+ */
+const LUCIDE_COPYRIGHT = 'Copyright (c) 2026 Lucide Icons and Contributors';
+const FEATHER_COPYRIGHT = 'Copyright (c) 2013-present Cole Bemis';
+const LICENSE_URL = 'https://lucide.dev/license';
+
 export default async function getStructuredData(iconName: string, pageData: PageData) {
-  const url = `https://lucide.dev/icons/${iconName}`;
+  const params = pageData.params ?? {};
+  const isLab = params.externalLibrary === 'lab';
+  const url = `https://lucide.dev/icons/${isLab ? 'lab/' : ''}${iconName}`;
+
+  const awaitingRelease = Boolean(params.awaitingRelease);

  return {
    '@context': 'https://schema.org',
@@ -29,18 +41,41 @@ export default async function getStructuredData(iconName: string, pageData: Page
      name: iconName,
      // TODO: Add support for description extraction from icon metadata
      // description: 'An ...SVG icon from the Lucide icon set.',
-      contentUrl: `https://lucide.dev/api/icons/${iconName}}?width=24&height=24&background=white`,
-      thumbnailUrl: `https://lucide.dev/api/icons/${iconName}}?width=256&height=256&background=white`,
+      // `/api/icons/<name>` only renders core icons, a lab name would 404 there.
+      ...(isLab
+        ? {}
+        : {
+            contentUrl: `https://lucide.dev/api/icons/${iconName}?width=24&height=24&background=white`,
+            thumbnailUrl: `https://lucide.dev/api/icons/${iconName}?width=256&height=256&background=white`,
+          }),
      encodingFormat: 'image/svg+xml',
-      keywords: pageData.params?.tags,
+      keywords: params.tags,
      width: 24,
      height: 24,
      creator: {
        '@type': 'Organization',
        name: 'Lucide Icons',
      },
-      datePublished: pageData?.params?.createdRelease?.date,
-      dateModified: pageData?.params?.changedRelease?.date,
+      license: LICENSE_URL,
+      acquireLicensePage: LICENSE_URL,
+      // The Feather-derived icons are MIT © Cole Bemis; everything else is ISC. Lab
+      // icons carry no release metadata, so they fall to the ISC-only notice.
+      copyrightNotice: params.fromFork
+        ? `${LUCIDE_COPYRIGHT}; ${FEATHER_COPYRIGHT}`
+        : LUCIDE_COPYRIGHT,
+      creditText: 'Lucide Icons',
+      // Both dates fall back to the date of the fork for unreleased icons, so neither
+      ...(awaitingRelease
+        ? {}
+        : {
+            ...(params.createdRelease?.date ? { datePublished: params.createdRelease.date } : {}),
+            ...(params.changedRelease?.date ? { dateModified: params.changedRelease.date } : {}),
+          }),
+
+      // Custom attributes, picked up by the Algolia crawler to rank and sort the icon
+      // index. Not schema.org vocabulary, consumers that don't know them ignore them.
+      popularity: params.popularity ?? 0,
+      awaitingRelease,
    },
  };
 }
@@ -27,7 +27,7 @@ defineProps({

 <style scoped>
 .fake-input {
-  background: var(--vp-c-bg-soft);
+  background: var(--vp-c-bg-alt);
  border-radius: 8px;
  color: var(--vp-c-text-2);
  padding: 11px 16px;
@@ -1,10 +1,9 @@
 <script setup lang="tsx">
 import VPSidebarGroup from 'vitepress/dist/client/theme-default/components/VPSidebarGroup.vue';
-import sidebar, { guideSidebarTop } from '../../../sidebar';
+import sidebar from '../../../sidebar';
 import { useData, useRouter } from 'vitepress';
 import Select from '../base/Select.vue';
-import { computed, ref, watch, watchEffect } from 'vue';
-import { link, route } from '~/.vitepress/data/iconNodes';
+import { computed } from 'vue';
 import { useLocalStorage } from '@vueuse/core';

 const { page } = useData();
@@ -75,14 +74,7 @@ function onSelectFramework(item: Framework) {
 </script>

 <template>
-  <VPSidebarGroup
-    :items="guideSidebarTop"
-    v-if="page?.relativePath?.startsWith?.('guide')"
-  />
-  <div
-    class="framework-select"
-    v-if="page?.relativePath?.startsWith?.('guide')"
-  >
+  <div class="framework-select">
    <label for="framework-select">Framework</label>
    <Select
      id="framework-select"
@@ -93,10 +85,7 @@ function onSelectFramework(item: Framework) {
  </div>
  <VPSidebarGroup
    :key="selected.value"
-    v-if="
-      page?.relativePath?.startsWith?.('guide') &&
-      !page?.relativePath?.startsWith?.(selected.value.substring(1))
-    "
+    v-if="!page?.relativePath?.startsWith?.(selected.value.substring(1))"
    :items="sidebar[selected.value]"
  />
 </template>
@@ -56,7 +56,6 @@ const scaleDownVariants: Variants = {
  riseUp: {
    x: 0.5,
    y: -0.5,
-    animationName: 'riseUp',
    scale: 1,
    transition: {
      delay: 0.5,
@@ -68,7 +67,6 @@ const scaleDownVariants: Variants = {
    x: -10.5,
    y: -10.5,
    scale: 0.1,
-    animationName: 'small',
    transition: {
      delay: 1,
      duration: 1,
@@ -84,7 +82,6 @@ const drawAnimation = ref('visible');
 const draw: Variants = {
  hidden: { pathLength: 0, opacity: 0 },
  visible: {
-    animationName: 'visible',
    pathLength: 1.02,
    opacity: 1,
    transition: {
@@ -93,7 +90,6 @@ const draw: Variants = {
    },
  },
  exit: (path) => ({
-    animationName: 'exit',
    stroke: path ? 'var(--vp-c-text-1)' : 'var(--vp-c-brand)',
    pathLength: 1.02,
    opacity: 1,
@@ -103,25 +99,26 @@ const draw: Variants = {
  }),
 };

-const onAnimationComplete = (item) => {
-  if (item.animationName === 'visible') {
+// motion-v passes the variant label that finished, not the resolved variant
+const onAnimationComplete = (variant: unknown) => {
+  if (variant === 'visible') {
    drawAnimation.value = 'exit';
    return;
  }
-  if (item.animationName === 'exit') {
+  if (variant === 'exit') {
    showHandles.value = false;
    scaleDownAnimation.value = 'small';
  }
-  if (item.animationName === 'small') {
+  if (variant === 'small') {
    iconGridAnimation.value = 'showIcons';
  }
-  if (item.animationName === 'riseUp') {
+  if (variant === 'riseUp') {
    scaleDownAnimation.value = 'small';
  }
-  if (item.animationName === 'showIcons') {
+  if (variant === 'showIcons') {
    shrinkIconAnimation.value = 'shrinkIcons';
  }
-  if (item.animationName === 'shrinkIcons') {
+  if (variant === 'shrinkIcons') {
    iconGridAnimation.value = 'initial';

    setTimeout(() => {
@@ -134,14 +131,12 @@ const randomIndex = ref(Math.floor(Math.random() * 64));

 const iconAnimationVariants: Variants = {
  initial: {
-    animationName: 'end',
    opacity: 0,
    x: 0,
    y: 0,
    transition: { duration: 1, delay: 1, ease: 'easeInOut' },
  },
  showIcons: (index) => ({
-    animationName: 'showIcons',
    opacity: [0, 1, 1],
    x: [0.5, 0, 0],
    y: [-0.5, 0, 0],
@@ -155,7 +150,6 @@ const shrinkIconAnimation = ref('initial');
 const shrinkIconVariants: Variants = {
  initial: { strokeWidth: 2 },
  shrinkIcons: (index) => ({
-    animationName: 'shrinkIcons',
    opacity: 1,
    strokeWidth: 0,
    transition: { delay: 1.8, duration: 1.5, ease: 'easeInOut' },
@@ -257,7 +251,7 @@ const shrinkIconVariants: Variants = {
        </motion.g>
        <motion.g
          class="svg-preview-control-path-marker-group"
-          stroke="#fff"
+          :style="{ stroke: 'var(--vp-c-text-1)' }"
          stroke-width="0.125"
          :initial="{ opacity: 1 }"
          :animate="showHandles ? { opacity: 1 } : { opacity: 0 }"
@@ -38,7 +38,7 @@ const pickIcons = [
  'map-pinned',
  'megaphone',
  'moon',
-  'music',
+  'sixteenth-notes',
  'phone',
  'power-off',
  'radio',
@@ -11,18 +11,6 @@ import RocketDuotoneIcon from './RocketDuotoneIcon.ts';
    <Badge :href="`https://github.com/lucide-icons/lucide/releases/tag/${data.version}`">
      v{{ data.version }}
    </Badge>
-    <Badge
-      class="badge-special confetti-button animate"
-      href="/guide/version-1"
-    >
-      <Icon :iconNode="RocketDuotoneIcon" name="rocket-duotone" />
-      Version 1
-      <Icon
-        :iconNode="moveRight"
-        name="move-right"
-        class=""
-      />
-    </Badge>
  </div>
 </template>

@@ -45,22 +33,6 @@ import RocketDuotoneIcon from './RocketDuotoneIcon.ts';
  gap: 8px;
  padding: 4px 8px;
 }
-
-.badge-special {
-  font-weight: 500;
-  color: var(--vp-c-brand-1);
-  text-underline-offset: 2px;
-  align-items: center;
-}
-
-.badge-special::before,
-.badge-special::after {
-  animation-delay: 0.5s !important;
-  animation-duration: 5s !important;
-  animation-iteration-count: infinite !important;
-  animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1) !important;
-  transform: translateX(32px);
-}
 </style>

 <style>
@@ -10,7 +10,7 @@ import {
  sun,
  moon,
  camera,
-  music,
+  sixteenthNotes,
  video,
  globe,
  layers,
@@ -44,7 +44,7 @@ import createElement from 'lucide/src/createElement';
 import { IconNode } from 'lucide/src/types';

 const icons: Component[] = [
-  heart, star, zap, code, feather, cloud, sun, moon, camera, music,
+  heart, star, zap, code, feather, cloud, sun, moon, camera, sixteenthNotes,
  video, globe, layers, packageIcon, compass, command, terminal, database,
  server, cpu, lock, key, shield, wifi, download, upload, search,
  settings, users, mail, bell, calendar, clock, gitBranch, funnel,
@@ -0,0 +1,206 @@
+<script lang="ts">
+import { ref } from 'vue'
+
+// This component can be rendered more than once on a page (e.g. a hidden
+// copy inside `.content-body`). DocSearch mounts into the first `#docsearch`
+// in the document, so only a single instance may ever render the search box.
+const loaded = ref(false)
+</script>
+
+<script lang="ts" setup>
+import '@docsearch/css/dist/style.css'
+import {
+  computed,
+  defineAsyncComponent,
+  onMounted,
+  onUnmounted,
+} from 'vue'
+import type { DefaultTheme } from 'vitepress/theme'
+
+import { useData } from 'vitepress'
+import FakeInput from '../base/FakeInput.vue'
+
+const VPAlgoliaSearchBox = defineAsyncComponent(() => import('vitepress/dist/client/theme-default/components/VPAlgoliaSearchBox.vue'));
+
+const { theme } = useData<DefaultTheme.Config>()
+
+const algolia = computed(
+  () =>
+    (theme.value.search?.options ?? theme.value.algolia) as DefaultTheme.AlgoliaSearchOptions,
+)
+
+// whether this instance is the one rendering the (hidden) search box
+const isOwner = ref(false)
+const shortcutText = ref('')
+
+// to avoid loading the docsearch js upfront (which is more than 1/3 of the
+// payload), we delay initializing it until the user has actually clicked or
+// hit the hotkey to invoke it.
+const preconnect = () => {
+  const id = 'VPAlgoliaPreconnect'
+  if (document.getElementById(id)) return
+
+  const rIC = window.requestIdleCallback || setTimeout
+  rIC(() => {
+    const preconnect = document.createElement('link')
+    preconnect.id = id
+    preconnect.rel = 'preconnect'
+    preconnect.href = `https://${algolia.value.appId}-dsn.algolia.net`
+    preconnect.crossOrigin = ''
+    document.head.appendChild(preconnect)
+  })
+}
+
+onMounted(() => {
+  preconnect()
+
+  shortcutText.value = /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform) ? '⌘K' : 'Ctrl+K'
+
+  // once docsearch is initialized it handles the hotkey itself
+  const handleSearchHotKey = (event: KeyboardEvent) => {
+    if (loaded.value) return remove()
+
+    if (
+      (event.key.toLowerCase() === 'k' && (event.metaKey || event.ctrlKey)) ||
+      (!isEditingContent(event) && event.key === '/')
+    ) {
+      event.preventDefault()
+      open()
+      remove()
+    }
+  }
+
+  const remove = () => {
+    window.removeEventListener('keydown', handleSearchHotKey)
+  }
+
+  window.addEventListener('keydown', handleSearchHotKey)
+
+  onUnmounted(remove)
+})
+
+function open() {
+  if (!loaded.value) {
+    loaded.value = true
+    isOwner.value = true
+  }
+  setTimeout(poll, 16)
+}
+
+function poll() {
+  // programmatically open the search box after initialize
+  const e = new Event('keydown') as any
+
+  e.key = 'k'
+  e.metaKey = true
+
+  window.dispatchEvent(e)
+
+  setTimeout(() => {
+    if (!document.querySelector('.DocSearch-Modal')) {
+      poll()
+    }
+  }, 16)
+}
+
+function isEditingContent(event: KeyboardEvent): boolean {
+  const element = event.target as HTMLElement
+  const tagName = element.tagName
+
+  return (
+    element.isContentEditable ||
+    tagName === 'INPUT' ||
+    tagName === 'SELECT' ||
+    tagName === 'TEXTAREA'
+  )
+}
+</script>
+
+<template>
+  <div class="VPNavBarSearch">
+    <FakeInput
+      class="nav-search-input"
+      :shortcut="shortcutText"
+      aria-label="Search"
+      @click="open"
+    >
+      Search
+    </FakeInput>
+
+    <!-- docsearch renders its own button here; we only need its modal -->
+    <div v-if="isOwner" class="docsearch-host">
+      <VPAlgoliaSearchBox :algolia="algolia" />
+    </div>
+  </div>
+</template>
+
+<style>
+
+@media (min-width: 768px) {
+  .VPNavBarSearch {
+    flex-grow: 1;
+    padding-left: 0px;
+  }
+}
+
+@media (min-width: 960px) {
+  .VPNavBarSearch {
+    padding-left: 0px;
+  }
+}
+
+.VPNavBarSearch {
+  padding-top: 24px;
+}
+
+.VPNavBarSearch .nav-search-input {
+  padding: 8px 12px;
+  align-items: center;
+  width: 100%;
+}
+
+.VPNavBarSearch .docsearch-host {
+  display: none;
+}
+
+[class*='DocSearch'] {
+  --docsearch-primary-color: var(--vp-c-brand-1);
+  --docsearch-highlight-color: var(--docsearch-primary-color);
+  --docsearch-text-color: var(--vp-c-text-1);
+  --docsearch-muted-color: var(--vp-c-text-2);
+  --docsearch-searchbox-shadow: none;
+  --docsearch-searchbox-background: transparent;
+  --docsearch-searchbox-focus-background: transparent;
+  --docsearch-key-gradient: transparent;
+  --docsearch-key-shadow: none;
+  --docsearch-modal-background: var(--vp-c-bg-soft);
+  --docsearch-footer-background: var(--vp-c-bg);
+}
+
+.dark [class*='DocSearch'] {
+  --docsearch-modal-shadow: none;
+  --docsearch-footer-shadow: none;
+  --docsearch-logo-color: var(--vp-c-text-2);
+  --docsearch-hit-background: var(--vp-c-gray-3);;
+  --docsearch-container-background: rgba(0, 0, 0, 0.4);
+  --docsearch-hit-color: var(--vp-c-text-2);
+  --docsearch-hit-shadow: none;
+}
+
+.dark .DocSearch-Footer {
+  border-top: 1px solid var(--vp-c-divider);
+}
+
+.DocSearch-Form {
+  border: 1px solid var(--vp-c-brand-1);
+  background-color: var(--vp-c-white);
+}
+
+.dark .DocSearch-Form {
+  background-color: var(--vp-c-default-soft);
+}
+
+.DocSearch-Screen-Icon > svg {
+  margin: auto;
+}
+</style>
@@ -10,14 +10,14 @@ import HomeHeroInfoBefore from './components/home/HomeHeroInfoBefore.vue';
 import { ICON_STYLE_CONTEXT, iconStyleContext } from './composables/useIconStyle';
 import { CATEGORY_VIEW_CONTEXT, categoryViewContext } from './composables/useCategoryView';
 import { EXTERNAL_LIBS_CONTEXT, externalLibContext } from './composables/useExternalLibs';
-import FrameworkSelect from './components/guide/FrameworkSelect.vue';
+import SideBarNavBefore from './layouts/SideBarNavBefore.vue';
 import SnackPlayer from './components/editors/SnackPlayer.vue';

 const theme: Partial<Theme> = {
  extends: DefaultTheme,
  Layout() {
    return h(DefaultTheme.Layout, null, {
-      'sidebar-nav-before': () => h(FrameworkSelect),
+      'sidebar-nav-before': () => h(SideBarNavBefore),
      'home-hero-info-before': () => h(HomeHeroInfoBefore),
      'sidebar-nav-after': () => h(IconsSidebarNavAfter),
      'home-hero-image': () => h(HomeHeroIconsCard),
@@ -0,0 +1,20 @@
+<script setup lang="ts">
+import { computed } from 'vue';
+import { useData } from 'vitepress';
+import VPSidebarGroup from 'vitepress/dist/client/theme-default/components/VPSidebarGroup.vue';
+import VPNavBarSearch from '../components/overrides/VPNavBarSearch.vue';
+import FrameworkSelect from '../components/guide/FrameworkSelect.vue';
+import { guideSidebarTop } from '../../sidebar';
+
+const { page } = useData();
+
+const isGuide = computed(() => page.value?.relativePath?.startsWith?.('guide'));
+</script>
+
+<template>
+  <template v-if="isGuide">
+    <VPNavBarSearch />
+    <VPSidebarGroup :items="guideSidebarTop" />
+    <FrameworkSelect />
+  </template>
+</template>
@@ -129,6 +129,10 @@ html {
  flex-direction: column-reverse;
 }

+.content-body .search {
+  display: none;
+}
+
@media (min-width: 960px) {
  .VPHomeHero .container .image {
    order: 1;
@@ -4,11 +4,8 @@ import { createGeneralOGImage, createIconOGImage } from './createOGImage';

 export async function transformPageData(pageData: PageData) {
  pageData.frontmatter.head ??= [];
-  if (
-    pageData.relativePath.startsWith('icons/') &&
-    !pageData.relativePath.startsWith('icons/lab/') &&
-    pageData.params?.name
-  ) {
+  if (pageData.relativePath.startsWith('icons/') && pageData.params?.name) {
+    const isLab = pageData.relativePath.startsWith('icons/lab/');
    const iconName = pageData.params.name;
    pageData.title = `${iconName} icon details`;

@@ -24,26 +21,29 @@ export async function transformPageData(pageData: PageData) {

    const structuredData = await getStructuredData(iconName, pageData);

-    const ogPath = await createIconOGImage(iconName, pageData.params?.tags || []);
+    // `createIconOGImage` reads the SVG from `icons/`, where lab icons don't live.
+    if (!isLab) {
+      const ogPath = await createIconOGImage(iconName, pageData.params?.tags || []);

-    if (ogPath) {
-      const content = `https://lucide.dev${ogPath}`;
-      pageData.frontmatter.head.push(
-        [
-          'meta',
-          {
-            property: 'og:image',
-            content,
-          },
-        ],
-        [
-          'meta',
-          {
-            property: 'twitter:image',
-            content,
-          },
-        ],
-      );
+      if (ogPath) {
+        const content = `https://lucide.dev${ogPath}`;
+        pageData.frontmatter.head.push(
+          [
+            'meta',
+            {
+              property: 'og:image',
+              content,
+            },
+          ],
+          [
+            'meta',
+            {
+              property: 'twitter:image',
+              content,
+            },
+          ],
+        );
+      }
    }

    pageData.frontmatter.head.push([
@@ -15,7 +15,7 @@ In an effort to expand the icon set while remaining true to the original minimal

 ### Why should I choose Lucide over Feather Icons?

- Lucide has expanded its icon set by 500+ in the last few years. Lucide now has over 1000 icons, while Feather has around 287 icons.
+- Lucide has expanded its icon set by 1600+ in the last few years. Lucide now has over 1800 icons, while Feather has around 287 icons.
 - Well maintained code base.
 - Active community.

@@ -3,11 +3,18 @@ import iconNodes from '../.vitepress/data/iconNodes';
 import * as iconDetails from '../.vitepress/data/iconDetails';
 import { IconEntity } from '../.vitepress/theme/types';

+/**
+ * The generated `iconDetails` modules import `iconPopularity/<name>.json` as-is,
+ * so popularity arrives as the raw `{ count }` object instead of a number.
+ */
+type IconDetail = Omit<IconEntity, 'popularity'> & { popularity?: { count: number } };
+
 export default {
  paths: async () => {
-    return (Object.values(iconDetails) as unknown as IconEntity[]).map((iconEntity) => {
+    return (Object.values(iconDetails) as unknown as IconDetail[]).map((iconEntity) => {
      const params = {
        ...iconEntity,
+        popularity: iconEntity.popularity?.count ?? 0,
        relatedIcons: relatedIcons[iconEntity.name].map((name: string) => ({
          name,
          iconNode: iconNodes[name],
@@ -30,6 +30,7 @@
  "author": "Eric Fennis",
  "license": "ISC",
  "devDependencies": {
+    "@docsearch/js": "3.8.2",
    "@lucide/build-icons": "workspace:*",
    "@lucide/helpers": "workspace:*",
    "@lucide/shared": "workspace:*",
@@ -57,6 +58,7 @@
    "vue-tsc": "^3.3.11"
  },
  "dependencies": {
+    "@docsearch/css": "3.8.2",
    "@floating-ui/vue": "^2.0.1",
    "@headlessui/vue": "^1.7.23",
    "@lucide/vue": "workspace:*",
@@ -70,9 +72,9 @@
    "lucide": "workspace:*",
    "lucide-react": "workspace:*",
    "motion-v": "2.4.0",
-    "react": "19.3.0",
-    "react-dom": "19.3.0",
+    "react": "19.3.1",
+    "react-dom": "19.3.1",
    "sandpack-vue3": "3.1.12",
-    "vue": "^3.5.43"
+    "vue": "^3.5.44"
  }
 }
@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 32 32">
+  <path d="M11.622 24.74s-1.23.748.855.962c2.51.32 3.847.267 6.625-.267a10.02 10.02 0 0 0 1.763.855c-6.25 2.672-14.16-.16-9.244-1.55zm-.8-3.473s-1.336 1.015.748 1.23c2.725.267 4.862.32 8.55-.427a3.26 3.26 0 0 0 1.282.801c-7.534 2.244-15.976.214-10.58-1.603zm14.747 6.09s.908.748-1.015 1.336c-3.58 1.07-15.014 1.39-18.22 0-1.122-.48 1.015-1.175 1.7-1.282.695-.16 1.07-.16 1.07-.16-1.23-.855-8.175 1.763-3.526 2.51 12.77 2.084 23.296-.908 19.983-2.404zM12.2 17.633s-5.824 1.39-2.084 1.87c1.603.214 4.755.16 7.694-.053 2.404-.214 4.81-.64 4.81-.64s-.855.374-1.443.748c-5.93 1.55-17.312.855-14.052-.748 2.778-1.336 5.076-1.175 5.076-1.175zm10.42 5.824c5.984-3.1 3.206-6.09 1.282-5.717-.48.107-.695.214-.695.214s.16-.32.534-.427c3.794-1.336 6.786 4.007-1.23 6.09 0 0 .053-.053.107-.16zm-9.83 8.442c5.77.374 14.587-.214 14.8-2.94 0 0-.427 1.07-4.755 1.87-4.916.908-11.007.8-14.587.214 0 0 .748.64 4.542.855z" fill="#4e7896"/>
+  <path d="M18.996.001s3.313 3.366-3.152 8.442c-5.183 4.114-1.175 6.465 0 9.137-3.046-2.725-5.236-5.13-3.74-7.373C14.294 6.893 20.332 5.3 18.996.001zm-1.7 15.335c1.55 1.763-.427 3.366-.427 3.366s3.954-2.03 2.137-4.542c-1.656-2.404-2.94-3.58 4.007-7.587 0 0-10.953 2.725-5.717 8.763z" fill="#f58219"/>
+</svg>
@@ -0,0 +1,50 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "danielbayley",
+    "devkamani9313",
+    "karsa-mistmere"
+  ],
+  "use-cases": [
+    "Representing fruit, guacamole, or healthy food in nutrition apps",
+    "Indicating salad, breakfast, or brunch ingredients",
+    "Showing vegetarian or vegan food options",
+    "Marking avocado toast as a menu item in restaurant or delivery apps",
+    "Denoting fresh produce or fruit section in grocery and supermarket apps",
+    "Signifying healthy fats or superfood in nutrition and wellness trackers",
+    "Labeling plant-based or vegetarian recipes in cooking websites and apps"
+  ],
+  "tags": [
+    "fruit",
+    "snack",
+    "meal",
+    "lunch",
+    "ingredient",
+    "cooking",
+    "cookery",
+    "kitchen",
+    "cuisine",
+    "eating",
+    "healthy",
+    "nutrition",
+    "diet",
+    "guacamole",
+    "mexican",
+    "green",
+    "pit",
+    "seed",
+    "half",
+    "produce",
+    "vegetarian",
+    "vegan",
+    "grocery",
+    "supermarket",
+    "toast",
+    "superfood",
+    "plant based",
+    "ripe"
+  ],
+  "categories": [
+    "food-beverage"
+  ]
+}
@@ -0,0 +1,14 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M13.465 3.464a5 5 0 017.07 0 5 5 0 010 7.072c-1.204 1.203-2.38 2.89-2.614 4.577A8 8 0 118.886 6.08c1.687-.235 3.375-1.41 4.579-2.615" />
+  <circle cx="10" cy="14" r="3" />
+</svg>
@@ -0,0 +1,51 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "danielbayley",
+    "devkamani9313",
+    "karsa-mistmere"
+  ],
+  "use-cases": [
+    "Representing breakfast items, rashers, or pork products",
+    "Indicating diner, brunch, or fast food menu items",
+    "Showing savory cooked meats or barbecue items",
+    "Labeling grocery or deli items in food apps",
+    "Marking breakfast sandwich or brunch special add-ons",
+    "Tagging cured or smoked meat ingredients in recipes"
+  ],
+  "tags": [
+    "rashers",
+    "smoked",
+    "streaky",
+    "crispy",
+    "meat",
+    "fast food",
+    "junk food",
+    "snack",
+    "dish",
+    "restaurant",
+    "brunch",
+    "lunch",
+    "meal",
+    "savory",
+    "savoury",
+    "cookery",
+    "cooking",
+    "grilled",
+    "barbecue",
+    "barbeque",
+    "bbq",
+    "pig",
+    "pork",
+    "breakfast",
+    "cured",
+    "butcher",
+    "sandwich",
+    "protein",
+    "grocery",
+    "kitchen"
+  ],
+  "categories": [
+    "food-beverage"
+  ]
+}
@@ -0,0 +1,14 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M2.795 16.804c-.789-.79-1.09-2.018-.442-2.928 1.933-2.713 4.414-1.05 6.145-5.378 1.868-4.67 4.608-2.366 6.592-6.107.218-.412.78-.53 1.11-.2l5.005 5.005c.789.79 1.09 2.018.442 2.928-1.933 2.713-4.414 1.05-6.145 5.378-1.868 4.67-4.608 2.366-6.591 6.107-.22.412-.78.53-1.11.2z" />
+  <path d="M4.5 18.5c2-5 5-2 7-7s5-2 7-7" />
+</svg>
@@ -9,9 +9,9 @@
  stroke-linecap="round"
  stroke-linejoin="round"
 >
-  <path d="M10 3a41 41 0 000 18" />
-  <path d="M14 3a41 41 0 010 18" />
-  <path d="M16.997 21a2 2 0 001.68-.92 15.25 15.25 0 000-16.16 2 2 0 00-1.68-.92h-10a2 2 0 00-1.681.92 15.25 15.25 0 000 16.16 2 2 0 001.681.92z" />
-  <path d="M3.54 16h16.914" />
-  <path d="M3.54 8h16.914" />
+  <path d="M10.5 2a34.5 34.5 0 000 20" />
+  <path d="M13.5 2a34.5 34.5 0 010 20" />
+  <path d="M4.67 17h14.67" />
+  <path d="M4.67 7h14.67" />
+  <path d="M6.23 3.06a19 19 0 000 17.88A2 2 0 008 22h8a2 2 0 001.77-1.06 19 19 0 000-17.88A2 2 0 0016 2H8a2 2 0 00-1.77 1.06" />
 </svg>
@@ -9,17 +9,16 @@
  stroke-linecap="round"
  stroke-linejoin="round"
 >
-  <path d="M12 5a3 3 0 1 0-5.997.125 4 4 0 0 0-2.526 5.77 4 4 0 0 0 .556 6.588A4 4 0 1 0 12 18Z" />
-  <path d="M9 13a4.5 4.5 0 0 0 3-4" />
-  <path d="M6.003 5.125A3 3 0 0 0 6.401 6.5" />
-  <path d="M3.477 10.896a4 4 0 0 1 .585-.396" />
-  <path d="M6 18a4 4 0 0 1-1.967-.516" />
  <path d="M12 13h4" />
-  <path d="M12 18h6a2 2 0 0 1 2 2v1" />
+  <path d="M12 18h6a2 2 0 012 2v1" />
  <path d="M12 8h8" />
-  <path d="M16 8V5a2 2 0 0 1 2-2" />
-  <circle cx="16" cy="13" r=".5" />
-  <circle cx="18" cy="3" r=".5" />
-  <circle cx="20" cy="21" r=".5" />
-  <circle cx="20" cy="8" r=".5" />
+  <path d="M12 9a4.17 4.17 0 01-3 4" />
+  <path d="M16 8V5a2 2 0 012-2" />
+  <path d="M6 18a4 4 0 01-2-7.465" />
+  <path d="M6.004 5.125a4 4 0 00-2.526 5.77" />
+  <path d="M6.294 6.294A3 3 0 1112 5v13a4 4 0 11-7.967-.518" />
+  <circle cx="16" cy="13" r="0.5" fill="currentColor" />
+  <circle cx="18" cy="3" r="0.5" fill="currentColor" />
+  <circle cx="20" cy="21" r="0.5" fill="currentColor" />
+  <circle cx="20" cy="8" r="0.5" fill="currentColor" />
 </svg>
@@ -12,15 +12,15 @@
  <path d="m10.852 14.772-.383.923" />
  <path d="m10.852 9.228-.383-.923" />
  <path d="m13.148 14.772.382.924" />
-  <path d="m13.531 8.305-.383.923" />
+  <path d="m13.53 8.305-.382.923" />
  <path d="m14.772 10.852.923-.383" />
  <path d="m14.772 13.148.923.383" />
-  <path d="M17.598 6.5A3 3 0 1 0 12 5a3 3 0 0 0-5.63-1.446 3 3 0 0 0-.368 1.571 4 4 0 0 0-2.525 5.771" />
-  <path d="M17.998 5.125a4 4 0 0 1 2.525 5.771" />
-  <path d="M19.505 10.294a4 4 0 0 1-1.5 7.706" />
-  <path d="M4.032 17.483A4 4 0 0 0 11.464 20c.18-.311.892-.311 1.072 0a4 4 0 0 0 7.432-2.516" />
-  <path d="M4.5 10.291A4 4 0 0 0 6 18" />
-  <path d="M6.002 5.125a3 3 0 0 0 .4 1.375" />
+  <path d="M17.997 5.125a4 4 0 012.526 5.77" />
+  <path d="M18 18a4 4 0 002-7.464" />
+  <path d="M4.033 17.483A4 4 0 0011.46 20c.184-.31.896-.31 1.076 0a4 4 0 007.43-2.517" />
+  <path d="M6 18a4 4 0 01-2-7.464" />
+  <path d="M6.002 5.125a4 4 0 00-2.525 5.77" />
+  <path d="M6.293 6.294a3 3 0 01-.287-1.098l-.004-.07a3 3 0 015.968-.543c.05.02.057.01.059 0a3 3 0 015.968.542l-.004.071a3 3 0 01-.287 1.098" />
  <path d="m9.228 10.852-.923-.383" />
  <path d="m9.228 13.148-.923.383" />
  <circle cx="12" cy="12" r="3" />
@@ -0,0 +1,33 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "karsa-mistmere",
+    "jguddas",
+    "it-is-not",
+    "jamiemlaw",
+    "ej52"
+  ],
+  "use-cases": [
+    "Indicating disabled reasoning in an AI chat interface"
+  ],
+  "tags": [
+    "medical",
+    "mind",
+    "mental",
+    "intellect",
+    "cerebral",
+    "consciousness",
+    "genius",
+    "artificial intelligence",
+    "ai",
+    "think",
+    "deep learning",
+    "machine learning",
+    "computing"
+  ],
+  "categories": [
+    "medical",
+    "science",
+    "development"
+  ]
+}
@@ -0,0 +1,22 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M12 18v-6" />
+  <path d="M12 5v1.344" />
+  <path d="M17.707 6.293A3 3 0 1012 5a3 3 0 00-4.124-2.781" />
+  <path d="M17.997 5.125a4 4 0 012.526 5.77" />
+  <path d="M19.644 19.644A4 4 0 0112 18a4 4 0 11-7.967-.517" />
+  <path d="m2 2 20 20" />
+  <path d="M20 10.536a4 4 0 011.533 5.34" />
+  <path d="M3.477 10.895a4 4 0 011.876-5.542" />
+  <path d="M6 18a4 4 0 01-2-7.464" />
+  <path d="M9 13a4.17 4.17 0 002.166-1.5 4 4 0 00.138-.196" />
+</svg>
@@ -10,11 +10,11 @@
  stroke-linejoin="round"
 >
  <path d="M12 18V5" />
-  <path d="M15 13a4.17 4.17 0 0 1-3-4 4.17 4.17 0 0 1-3 4" />
-  <path d="M17.598 6.5A3 3 0 1 0 12 5a3 3 0 1 0-5.598 1.5" />
-  <path d="M17.997 5.125a4 4 0 0 1 2.526 5.77" />
-  <path d="M18 18a4 4 0 0 0 2-7.464" />
-  <path d="M19.967 17.483A4 4 0 1 1 12 18a4 4 0 1 1-7.967-.517" />
-  <path d="M6 18a4 4 0 0 1-2-7.464" />
-  <path d="M6.003 5.125a4 4 0 0 0-2.526 5.77" />
+  <path d="M15 13a4.17 4.17 0 01-3-4 4.17 4.17 0 01-3 4" />
+  <path d="M17.707 6.294A3 3 0 1012 5a3 3 0 10-5.707 1.294" />
+  <path d="M17.996 5.125a4 4 0 012.526 5.77" />
+  <path d="M18 18a4 4 0 002-7.465" />
+  <path d="M19.967 17.482a4 4 0 11-7.967.517 4 4 0 11-7.967-.517" />
+  <path d="M6 18a4 4 0 01-2-7.465" />
+  <path d="M6.004 5.125a4 4 0 00-2.526 5.77" />
 </svg>
@@ -0,0 +1,44 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "rrod497"
+  ],
+  "use-cases": [
+    "Representing SSL/TLS security certificates",
+    "Representing educational or professional certifications"
+  ],
+  "tags": [
+    "award",
+    "ribbon",
+    "medal",
+    "achievement",
+    "pinned",
+    "badge",
+    "recognition",
+    "laurel",
+    "commendation",
+    "diploma",
+    "official",
+    "proof",
+    "fact",
+    "verified",
+    "license",
+    "warrant",
+    "authorization",
+    "legal",
+    "ownership",
+    "credential",
+    "ssl",
+    "tls",
+    "security",
+    "trust",
+    "cybersecurity",
+    "authority",
+    "graduation",
+    "study"
+  ],
+  "categories": [
+    "connectivity",
+    "security"
+  ]
+}
@@ -0,0 +1,17 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M12 10H6" />
+  <path d="m20.69 15.479 1.29 4.88a.5.5 0 01-.698.591l-1.843-.849a1 1 0 00-.879.001l-1.846.85a.5.5 0 01-.692-.593l1.29-4.88" />
+  <path d="M22 6.675V6a2 2 0 00-2-2H4a2 2 0 00-2 2v12a2 2 0 002 2h8" />
+  <path d="M6 14h4" />
+  <circle cx="19" cy="13" r="3" />
+</svg>
@@ -9,11 +9,11 @@
  stroke-linecap="round"
  stroke-linejoin="round"
 >
-  <path d="M4 20a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v1a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1z" />
-  <path d="m12.474 5.943 1.567 5.34a1 1 0 0 0 1.75.328l2.616-3.402" />
-  <path d="m20 9-3 9" />
-  <path d="m5.594 8.209 2.615 3.403a1 1 0 0 0 1.75-.329l1.567-5.34" />
-  <path d="M7 18 4 9" />
+  <path d="m10.68 5.499-.996 4.982a.65.65 0 01-1.131.295L5.885 7.663" />
+  <path d="m13.32 5.5.995 4.98a.65.65 0 001.131.296l2.668-3.113" />
+  <path d="M20.428 8.952 17.5 18" />
+  <path d="M4 20a2 2 0 012-2h12a2 2 0 012 2v1a1 1 0 01-1 1H5a1 1 0 01-1-1z" />
+  <path d="M6.5 18 3.571 8.952" />
  <circle cx="12" cy="4" r="2" />
  <circle cx="20" cy="7" r="2" />
  <circle cx="4" cy="7" r="2" />
@@ -0,0 +1,31 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "it-is-not",
+    "danielbayley",
+    "karsa-mistmere",
+    "jamiemlaw"
+  ],
+  "use-cases": [
+    "Representing music or an audio track",
+    "Representing a single eighth note in music notation"
+  ],
+  "tags": [
+    "audio",
+    "music",
+    "sound",
+    "note",
+    "quaver"
+  ],
+  "categories": [
+    "multimedia",
+    "files"
+  ],
+  "aliases": [
+    {
+      "name": "music-2",
+      "deprecationReason": "alias.name",
+      "deprecated": true
+    }
+  ]
+}
@@ -9,6 +9,6 @@
  stroke-linecap="round"
  stroke-linejoin="round"
 >
-  <circle cx="8" cy="18" r="4" />
-  <path d="M12 18V2l7 4" />
+  <path d="m19 6-5.2-3.9a.5.5 0 0 0-.8.4V18" />
+  <circle cx="9" cy="18" r="4" />
 </svg>
@@ -0,0 +1,32 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "colebemis",
+    "csandman",
+    "mittalyashu",
+    "ericfennis",
+    "jamiemlaw"
+  ],
+  "use-cases": [
+    "Representing music or an audio track",
+    "Representing paired eighth notes in music notation"
+  ],
+  "tags": [
+    "audio",
+    "music",
+    "sound",
+    "notes",
+    "quavers"
+  ],
+  "categories": [
+    "multimedia",
+    "files"
+  ],
+  "aliases": [
+    {
+      "name": "music",
+      "deprecationReason": "alias.name",
+      "deprecated": true
+    }
+  ]
+}
@@ -9,8 +9,7 @@
  stroke-linecap="round"
  stroke-linejoin="round"
 >
-  <path d="M9 18V5l12-2v13" />
-  <path d="m9 9 12-2" />
-  <circle cx="6" cy="18" r="3" />
+  <path d="M21 16V3a1 1 0 0 0-1.28-.96l-10 2.917a1 1 0 0 0-.72.96V19" />
  <circle cx="18" cy="16" r="3" />
+  <circle cx="6" cy="19" r="3" />
 </svg>
@@ -0,0 +1,36 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "Carlito-la-banane"
+  ],
+  "use-cases": [
+    "Representing a load balancer in cloud infrastructure",
+    "Showing traffic distributed across multiple servers",
+    "Indicating a task split into parallel processes",
+    "Representing a load balancer in cloud service consoles",
+    "Showing incoming traffic distributed across multiple backends",
+    "Indicating a task split into parallel worker threads or processes",
+    "Marking fan-out patterns in system architecture or topology diagrams"
+  ],
+  "tags": [
+    "load balancer",
+    "distribute",
+    "traffic",
+    "network",
+    "nodes",
+    "parallel",
+    "branch",
+    "hierarchy",
+    "routing",
+    "dispatcher",
+    "cluster",
+    "backend",
+    "fan-out",
+    "topology",
+    "orchestration"
+  ],
+  "categories": [
+    "connectivity",
+    "development"
+  ]
+}
@@ -0,0 +1,19 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <circle cx="12" cy="7" r="4" />
+  <circle cx="4" cy="19" r="2" />
+  <circle cx="12" cy="19" r="2" />
+  <circle cx="20" cy="19" r="2" />
+  <path d="M8 7a4 4 0 0 0-4 4v6" />
+  <path d="M12 11v6" />
+  <path d="M16 7a4 4 0 0 1 4 4v6" />
+</svg>
@@ -0,0 +1,32 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "it-is-not",
+    "danielbayley",
+    "karsa-mistmere"
+  ],
+  "use-cases": [
+    "Representing music or an audio track",
+    "Representing a half note in music notation"
+  ],
+  "tags": [
+    "audio",
+    "music",
+    "sound",
+    "note",
+    "crotchet",
+    "minim",
+    "quarter note"
+  ],
+  "categories": [
+    "multimedia",
+    "files"
+  ],
+  "aliases": [
+    {
+      "name": "music-3",
+      "deprecationReason": "alias.name",
+      "deprecated": true
+    }
+  ]
+}
@@ -0,0 +1,24 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "madebyoz"
+  ],
+  "use-cases": [
+    "Adjusting spacing between characters in text editors and design tools"
+  ],
+  "tags": [
+    "tracking",
+    "kerning",
+    "design",
+    "lettering",
+    "text",
+    "letters",
+    "characters",
+    "font",
+    "typography",
+    "formatting"
+  ],
+  "categories": [
+    "text"
+  ]
+}
@@ -9,6 +9,8 @@
  stroke-linecap="round"
  stroke-linejoin="round"
 >
-  <path d="M22 8c-2 5-5 2-7 7s-5 2-7 7l-6-6c2-5 5-2 7-7s5-2 7-7Z" />
-  <path d="M5 19c2-5 5-2 7-7s5-2 7-7" />
+  <path d="M15 14H9" />
+  <path d="M21 3v18" />
+  <path d="M3 3v18" />
+  <path d="m8 16 3.453-7.648a.6.6 0 011.094.001L16 16" />
 </svg>
@@ -0,0 +1,26 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "madebyoz"
+  ],
+  "use-cases": [
+    "Adjusting spacing between lines in text editors and design tools"
+  ],
+  "tags": [
+    "leading",
+    "text",
+    "letters",
+    "characters",
+    "font",
+    "typography",
+    "spacing",
+    "paragraph",
+    "formatting",
+    "editor",
+    "readability",
+    "typesetting"
+  ],
+  "categories": [
+    "text"
+  ]
+}
@@ -0,0 +1,16 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M15 14H9" />
+  <path d="M21 21H3" />
+  <path d="M21 3H3" />
+  <path d="m8 16 3.453-7.648a.6.6 0 011.094.001L16 16" />
+</svg>
@@ -1,18 +0,0 @@
-{
-  "$schema": "../icon.schema.json",
-  "contributors": [
-    "it-is-not",
-    "danielbayley",
-    "karsa-mistmere"
-  ],
-  "use-cases": [],
-  "tags": [
-    "quaver",
-    "eighth note",
-    "note"
-  ],
-  "categories": [
-    "multimedia",
-    "files"
-  ]
-}
@@ -1,20 +0,0 @@
-{
-  "$schema": "../icon.schema.json",
-  "contributors": [
-    "it-is-not",
-    "danielbayley",
-    "karsa-mistmere"
-  ],
-  "use-cases": [],
-  "tags": [
-    "crotchet",
-    "minim",
-    "quarter note",
-    "half note",
-    "note"
-  ],
-  "categories": [
-    "multimedia",
-    "files"
-  ]
-}
@@ -1,17 +0,0 @@
-{
-  "$schema": "../icon.schema.json",
-  "contributors": [
-    "it-is-not",
-    "karsa-mistmere"
-  ],
-  "use-cases": [],
-  "tags": [
-    "semiquaver",
-    "sixteenth note",
-    "note"
-  ],
-  "categories": [
-    "multimedia",
-    "files"
-  ]
-}
@@ -1,19 +0,0 @@
-{
-  "$schema": "../icon.schema.json",
-  "contributors": [
-    "colebemis",
-    "csandman",
-    "mittalyashu",
-    "ericfennis"
-  ],
-  "use-cases": [],
-  "tags": [
-    "note",
-    "quaver",
-    "eighth note"
-  ],
-  "categories": [
-    "multimedia",
-    "files"
-  ]
-}
@@ -0,0 +1,30 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "it-is-not",
+    "karsa-mistmere",
+    "jamiemlaw"
+  ],
+  "use-cases": [
+    "Representing music or an audio track",
+    "Representing paired sixteenth notes in music notation"
+  ],
+  "tags": [
+    "audio",
+    "music",
+    "sound",
+    "notes",
+    "semiquavers"
+  ],
+  "categories": [
+    "multimedia",
+    "files"
+  ],
+  "aliases": [
+    {
+      "name": "music-4",
+      "deprecationReason": "alias.name",
+      "deprecated": true
+    }
+  ]
+}
@@ -0,0 +1,16 @@
+<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M21 16V3a1 1 0 0 0-1.28-.96l-10 2.917a1 1 0 0 0-.72.96V19" />
+  <path d="M21 6 9 9.5" />
+  <circle cx="18" cy="16" r="3" />
+  <circle cx="6" cy="19" r="3" />
+</svg>
@@ -0,0 +1,40 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "hitanshu-machhi",
+    "colebemis",
+    "csandman",
+    "ericfennis",
+    "karsa-mistmere",
+    "jguddas",
+    "mittalyashu"
+  ],
+  "use-cases": [
+    "Representing a user profile in a mobile application",
+    "Indicating a mobile account or device owner",
+    "Showing mobile contact or identity settings",
+    "Displaying a user avatar in a mobile dashboard",
+    "Linking to a contact's profile from a mobile list",
+    "Indicating mobile sign-in or authentication screens",
+    "Marking a device as assigned to a user in device management apps"
+  ],
+  "tags": [
+    "phone",
+    "cellphone",
+    "device",
+    "mobile",
+    "person",
+    "profile",
+    "account",
+    "avatar",
+    "contact",
+    "identity",
+    "owner",
+    "authentication"
+  ],
+  "categories": [
+    "account",
+    "devices",
+    "people"
+  ]
+}
@@ -9,6 +9,8 @@
  stroke-linecap="round"
  stroke-linejoin="round"
 >
-  <path d="M22 7a4.95 4.95 0 0 0-8.6-3.4c-1.5 1.6-1.6 1.8-5 2.6a8 8 0 1 0 9.4 9.5c.7-3.4 1-3.6 2.6-5 1-1 1.6-2.3 1.6-3.7" />
-  <circle cx="10" cy="14" r="3.5" />
+  <path d="M10 22H6a2 2 0 01-2-2V4a2 2 0 012-2h10a2 2 0 012 2v4" />
+  <path d="M11 18h.01" />
+  <path d="M22 22a4 4 0 00-8 0" />
+  <circle cx="18" cy="15" r="3" />
 </svg>
@@ -0,0 +1,41 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "jguddas",
+    "ryck"
+  ],
+  "use-cases": [
+    "Marking death or game-over states in games, often paired with skull or ghost icons",
+    "Indicating cemetery or graveyard locations on maps",
+    "Marking deceased individuals in genealogy or family-tree applications",
+    "Flagging obsolete, deprecated, or retired items such as endpoints or pages"
+  ],
+  "tags": [
+    "grave",
+    "gravestone",
+    "headstone",
+    "cemetery",
+    "graveyard",
+    "death",
+    "memorial",
+    "funeral",
+    "halloween",
+    "rip",
+    "obituary",
+    "deceased",
+    "epitaph",
+    "mourning",
+    "bereavement",
+    "condolence",
+    "deprecated",
+    "retired",
+    "archived",
+    "decommissioned"
+  ],
+  "categories": [
+    "gaming",
+    "navigation",
+    "people",
+    "development"
+  ]
+}
@@ -9,7 +9,8 @@
  stroke-linecap="round"
  stroke-linejoin="round"
 >
-  <path d="M9 18V5l12-2v13" />
-  <circle cx="6" cy="18" r="3" />
-  <circle cx="18" cy="16" r="3" />
+  <path d="M11 10h2" />
+  <path d="M19 21V10a7 7 0 00-14 0v11" />
+  <path d="M2 21h20" />
+  <path d="M9 14h6" />
 </svg>
@@ -12,8 +12,8 @@
  "dependencies": {
    "lucide-react": "workspace:*",
    "next": "16.3.8",
-    "react": "19.3.0",
-    "react-dom": "19.3.0"
+    "react": "19.3.1",
+    "react-dom": "19.3.1"
  },
  "devDependencies": {
    "@types/react": "19.3.0",
@@ -14,8 +14,8 @@
    "@react-router/serve": "8.3.1",
    "isbot": "5.2.2",
    "lucide-react": "workspace:*",
-    "react": "19.3.0",
-    "react-dom": "19.3.0",
+    "react": "19.3.1",
+    "react-dom": "19.3.1",
    "react-router": "8.3.1"
  },
  "devDependencies": {
@@ -12,8 +12,8 @@
  "dependencies": {
    "@tanstack/react-router": "1.170.32",
    "lucide-react": "workspace:*",
-    "react": "19.3.0",
-    "react-dom": "19.3.0"
+    "react": "19.3.1",
+    "react-dom": "19.3.1"
  },
  "devDependencies": {
    "@tanstack/router-plugin": "1.168.35",
@@ -13,8 +13,8 @@
    "@tanstack/react-router": "1.170.41",
    "@tanstack/react-start": "1.168.60",
    "lucide-react": "workspace:*",
-    "react": "19.3.0",
-    "react-dom": "19.3.0"
+    "react": "19.3.1",
+    "react-dom": "19.3.1"
  },
  "devDependencies": {
    "@types/node": "^26.1.1",
@@ -11,8 +11,8 @@
  },
  "dependencies": {
    "lucide-react": "workspace:*",
-    "react": "19.3.0",
-    "react-dom": "19.3.0"
+    "react": "19.3.1",
+    "react-dom": "19.3.1"
  },
  "devDependencies": {
    "@types/react": "19.3.0",
@@ -0,0 +1,18 @@
+# Lucide Svelte integrations
+
+These fixtures exercise the built `@lucide/svelte` package in real consumer frameworks.
+
+Every fixture runs three checks:
+
+- a framework production build;
+- TypeScript with `svelte-check` (`noEmit`);
+- Vitest Browser Mode in Chromium.
+
+From the repository root, install Chromium once and run the complete suite:
+
+```sh
+pnpm --filter @lucide/integration-svelte-vite exec playwright install chromium
+pnpm test:integrations:svelte
+```
+
+The fixtures depend on `@lucide/svelte` through `workspace:*`, but import only its public package entry point. The root command builds `@lucide/svelte` before running any consumer checks.
@@ -0,0 +1,32 @@
+{
+  "name": "@lucide/integration-svelte-sveltekit",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "build": "vite build",
+    "typecheck": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+    "test:browser": "vitest run",
+    "check": "pnpm build && pnpm typecheck && pnpm test:browser"
+  },
+  "imports": {
+    "#lib": "./src/lib/index.js",
+    "#lib/*": "./src/lib/*"
+  },
+  "dependencies": {
+    "@lucide/svelte": "workspace:*",
+    "svelte": "5.57.2"
+  },
+  "devDependencies": {
+    "@sveltejs/adapter-auto": "^8.0.0",
+    "@sveltejs/kit": "^3.1.0",
+    "@sveltejs/vite-plugin-svelte": "^7.3.1",
+    "@vitest/browser-playwright": "5.0.3",
+    "playwright": "1.58.2",
+    "svelte-check": "^4.7.6",
+    "typescript": "^6.0.3",
+    "vite": "^8.3.2",
+    "vitest": "5.0.3",
+    "vitest-browser-svelte": "3.1.0"
+  }
+}
@@ -0,0 +1,13 @@
+// See https://svelte.dev/docs/kit/types#app.d.ts
+// for information about these interfaces
+declare global {
+  namespace App {
+    // interface Error {}
+    // interface Locals {}
+    // interface PageData {}
+    // interface PageState {}
+    // interface Platform {}
+  }
+}
+
+export {};
@@ -0,0 +1,18 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1"
+    />
+    <meta
+      name="text-scale"
+      content="scale"
+    />
+    %sveltekit.head%
+  </head>
+  <body data-sveltekit-preload-data="hover">
+    <div style="display: contents">%sveltekit.body%</div>
+  </body>
+</html>
@@ -0,0 +1,21 @@
+<script lang="ts">
+  import { Camera, Droplet, Edit2, House, Pen } from '@lucide/svelte';
+  import LucideProvider from './LucideProvider.svelte';
+</script>
+
+<main aria-label="Lucide integration">
+  <Camera data-testid="static-icon" />
+  <Droplet
+    data-testid="custom-icon"
+    class="consumer-icon"
+    color="red"
+    size={48}
+    strokeWidth={4}
+    absoluteStrokeWidth
+  />
+  <LucideProvider>
+    <House data-testid="provider-icon" />
+  </LucideProvider>
+  <Pen data-testid="canonical-icon" />
+  <Edit2 data-testid="alias-icon" />
+</main>
@@ -0,0 +1,10 @@
+<script lang="ts">
+  import type { Snippet } from 'svelte';
+  import { setLucideProps } from '@lucide/svelte';
+
+  const { children }: { children: Snippet } = $props();
+
+  setLucideProps({ color: 'purple', size: 32, strokeWidth: 3 });
+</script>
+
+{@render children()}
@@ -0,0 +1 @@
+// place files you want to import through the `#lib` alias in this folder.
@@ -0,0 +1,7 @@
+<script lang="ts">
+  import type { LayoutProps } from './$types';
+
+  let { children }: LayoutProps = $props();
+</script>
+
+{@render children()}
@@ -0,0 +1,5 @@
+<script lang="ts">
+  import IconShowcase from '#lib/IconShowcase.svelte';
+</script>
+
+<IconShowcase />
@@ -0,0 +1,33 @@
+import { expect, test } from 'vitest';
+import { render } from 'vitest-browser-svelte';
+import Page from '../src/routes/+page.svelte';
+
+test('renders Lucide public APIs in a real browser', async () => {
+  const screen = await render(Page);
+
+  const staticIcon = screen.getByTestId('static-icon');
+  await expect.element(staticIcon).toBeVisible();
+  await expect.element(staticIcon).toHaveAttribute('width', '24');
+  await expect.element(staticIcon).toHaveAttribute('height', '24');
+  await expect.element(staticIcon).toHaveAttribute('viewBox', '0 0 24 24');
+  await expect.element(staticIcon).toHaveAttribute('aria-hidden', 'true');
+
+  const customIcon = screen.getByTestId('custom-icon');
+  await expect.element(customIcon).toBeVisible();
+  await expect.element(customIcon).toHaveAttribute('width', '48');
+  await expect.element(customIcon).toHaveAttribute('height', '48');
+  await expect.element(customIcon).toHaveAttribute('stroke', 'red');
+  await expect.element(customIcon).toHaveAttribute('stroke-width', '2');
+  await expect.element(customIcon).toHaveClass('consumer-icon');
+
+  const providerIcon = screen.getByTestId('provider-icon');
+  await expect.element(providerIcon).toHaveAttribute('width', '32');
+  await expect.element(providerIcon).toHaveAttribute('stroke', 'purple');
+  await expect.element(providerIcon).toHaveAttribute('stroke-width', '3');
+
+  const aliasIcon = screen.getByTestId('alias-icon');
+  const canonicalIcon = screen.getByTestId('canonical-icon');
+  await expect.element(aliasIcon).toBeVisible();
+  await expect.element(canonicalIcon).toBeVisible();
+  expect(aliasIcon.element().innerHTML).toBe(canonicalIcon.element().innerHTML);
+});
@@ -0,0 +1,7 @@
+{
+  "extends": "$app/tsconfig",
+  "compilerOptions": {
+    "strict": true
+  },
+  "include": ["src", "tests", "vite.config.ts", "vitest.config.ts"]
+}
@@ -0,0 +1,20 @@
+import adapter from '@sveltejs/adapter-auto';
+import { sveltekit } from '@sveltejs/kit/vite';
+import { defineConfig } from 'vite';
+
+export default defineConfig({
+  plugins: [
+    sveltekit({
+      compilerOptions: {
+        // Force runes mode for the project, except for libraries. Can be removed in svelte 6.
+        runes: ({ filename }) =>
+          filename.split(/[/\\]/).includes('node_modules') ? undefined : true,
+      },
+
+      // adapter-auto only supports some environments, see https://svelte.dev/docs/kit/adapter-auto for a list.
+      // If your environment is not supported, or you settled on a specific environment, switch out the adapter.
+      // See https://svelte.dev/docs/kit/adapters for more information about adapters.
+      adapter: adapter(),
+    }),
+  ],
+});
@@ -0,0 +1,18 @@
+import { playwright } from '@vitest/browser-playwright';
+import { defineConfig, mergeConfig } from 'vitest/config';
+import viteConfig from './vite.config.ts';
+
+export default mergeConfig(
+  viteConfig,
+  defineConfig({
+    test: {
+      include: ['tests/**/*.spec.ts'],
+      browser: {
+        enabled: true,
+        headless: true,
+        provider: playwright(),
+        instances: [{ browser: 'chromium' }],
+      },
+    },
+  }),
+);
@@ -0,0 +1,18 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0"
+    />
+    <title>Lucide Svelte integration</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script
+      type="module"
+      src="/src/main.ts"
+    ></script>
+  </body>
+</html>
@@ -0,0 +1,28 @@
+{
+  "name": "@lucide/integration-svelte-vite",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "build": "vite build",
+    "typecheck": "svelte-check --tsconfig ./tsconfig.app.json && tsc -p tsconfig.node.json",
+    "test:browser": "vitest run",
+    "check": "pnpm build && pnpm typecheck && pnpm test:browser"
+  },
+  "dependencies": {
+    "@lucide/svelte": "workspace:*",
+    "svelte": "5.57.2"
+  },
+  "devDependencies": {
+    "@sveltejs/vite-plugin-svelte": "^7.3.1",
+    "@tsconfig/svelte": "^5.0.8",
+    "@types/node": "^26.1.1",
+    "@vitest/browser-playwright": "5.0.3",
+    "playwright": "1.58.2",
+    "svelte-check": "^4.7.6",
+    "typescript": "^6.0.3",
+    "vite": "^8.3.2",
+    "vitest": "5.0.3",
+    "vitest-browser-svelte": "3.1.0"
+  }
+}
@@ -0,0 +1,5 @@
+<script lang="ts">
+  import IconShowcase from './lib/IconShowcase.svelte';
+</script>
+
+<IconShowcase />
@@ -0,0 +1,21 @@
+<script lang="ts">
+  import { Camera, Droplet, Edit2, House, Pen } from '@lucide/svelte';
+  import LucideProvider from './LucideProvider.svelte';
+</script>
+
+<main aria-label="Lucide integration">
+  <Camera data-testid="static-icon" />
+  <Droplet
+    data-testid="custom-icon"
+    class="consumer-icon"
+    color="red"
+    size={48}
+    strokeWidth={4}
+    absoluteStrokeWidth
+  />
+  <LucideProvider>
+    <House data-testid="provider-icon" />
+  </LucideProvider>
+  <Pen data-testid="canonical-icon" />
+  <Edit2 data-testid="alias-icon" />
+</main>
@@ -0,0 +1,10 @@
+<script lang="ts">
+  import type { Snippet } from 'svelte';
+  import { setLucideProps } from '@lucide/svelte';
+
+  const { children }: { children: Snippet } = $props();
+
+  setLucideProps({ color: 'purple', size: 32, strokeWidth: 3 });
+</script>
+
+{@render children()}
@@ -0,0 +1,8 @@
+import { mount } from 'svelte';
+import App from './App.svelte';
+
+const app = mount(App, {
+  target: document.getElementById('app')!,
+});
+
+export default app;
@@ -0,0 +1,2 @@
+/** @type {import("@sveltejs/vite-plugin-svelte").SvelteConfig} */
+export default {};
@@ -0,0 +1,33 @@
+import { expect, test } from 'vitest';
+import { render } from 'vitest-browser-svelte';
+import App from '../src/App.svelte';
+
+test('renders Lucide public APIs in a real browser', async () => {
+  const screen = await render(App);
+
+  const staticIcon = screen.getByTestId('static-icon');
+  await expect.element(staticIcon).toBeVisible();
+  await expect.element(staticIcon).toHaveAttribute('width', '24');
+  await expect.element(staticIcon).toHaveAttribute('height', '24');
+  await expect.element(staticIcon).toHaveAttribute('viewBox', '0 0 24 24');
+  await expect.element(staticIcon).toHaveAttribute('aria-hidden', 'true');
+
+  const customIcon = screen.getByTestId('custom-icon');
+  await expect.element(customIcon).toBeVisible();
+  await expect.element(customIcon).toHaveAttribute('width', '48');
+  await expect.element(customIcon).toHaveAttribute('height', '48');
+  await expect.element(customIcon).toHaveAttribute('stroke', 'red');
+  await expect.element(customIcon).toHaveAttribute('stroke-width', '2');
+  await expect.element(customIcon).toHaveClass('consumer-icon');
+
+  const providerIcon = screen.getByTestId('provider-icon');
+  await expect.element(providerIcon).toHaveAttribute('width', '32');
+  await expect.element(providerIcon).toHaveAttribute('stroke', 'purple');
+  await expect.element(providerIcon).toHaveAttribute('stroke-width', '3');
+
+  const aliasIcon = screen.getByTestId('alias-icon');
+  const canonicalIcon = screen.getByTestId('canonical-icon');
+  await expect.element(aliasIcon).toBeVisible();
+  await expect.element(canonicalIcon).toBeVisible();
+  expect(aliasIcon.element().innerHTML).toBe(canonicalIcon.element().innerHTML);
+});
@@ -0,0 +1,21 @@
+{
+  "extends": "@tsconfig/svelte/tsconfig.json",
+  "compilerOptions": {
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
+    "target": "es2023",
+    "module": "esnext",
+    "types": ["svelte", "vite/client"],
+    "allowArbitraryExtensions": true,
+    "noEmit": true,
+    /**
+     * Typecheck JS in `.svelte` and `.js` files by default.
+     * Disable checkJs if you'd like to use dynamic types in JS.
+     * Note that setting allowJs false does not prevent the use
+     * of JS in `.svelte` files.
+     */
+    "allowJs": true,
+    "checkJs": true,
+    "moduleDetection": "force"
+  },
+  "include": ["src/**/*.ts", "src/**/*.js", "src/**/*.svelte", "tests/**/*.ts"]
+}
@@ -0,0 +1,4 @@
+{
+  "files": [],
+  "references": [{ "path": "./tsconfig.app.json" }, { "path": "./tsconfig.node.json" }]
+}
@@ -0,0 +1,23 @@
+{
+  "compilerOptions": {
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
+    "target": "es2023",
+    "lib": ["ES2023"],
+    "types": ["node"],
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    "module": "nodenext",
+    "allowImportingTsExtensions": true,
+    "verbatimModuleSyntax": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+
+    /* Linting */
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "erasableSyntaxOnly": true,
+    "noFallthroughCasesInSwitch": true
+  },
+  "include": ["vite.config.ts", "vitest.config.ts"]
+}
@@ -0,0 +1,7 @@
+import { svelte } from '@sveltejs/vite-plugin-svelte';
+import { defineConfig } from 'vite';
+
+// https://vite.dev/config/
+export default defineConfig({
+  plugins: [svelte()],
+});
@@ -0,0 +1,18 @@
+import { playwright } from '@vitest/browser-playwright';
+import { defineConfig, mergeConfig } from 'vitest/config';
+import viteConfig from './vite.config.ts';
+
+export default mergeConfig(
+  viteConfig,
+  defineConfig({
+    test: {
+      include: ['tests/**/*.spec.ts'],
+      browser: {
+        enabled: true,
+        headless: true,
+        provider: playwright(),
+        instances: [{ browser: 'chromium' }],
+      },
+    },
+  }),
+);
@@ -12,11 +12,11 @@
  "dependencies": {
    "@lucide/vue": "workspace:*",
    "nuxt": "4.5.1",
-    "vue": "3.5.43",
+    "vue": "3.5.44",
    "vue-router": "5.3.1"
  },
  "devDependencies": {
-    "@vitejs/plugin-vue": "^6.0.8",
+    "@vitejs/plugin-vue": "^6.0.10",
    "@vitest/browser-playwright": "5.0.3",
    "typescript": "^6.0.3",
    "vite": "^8.3.2",
@@ -13,10 +13,10 @@
    "@lucide/vue": "workspace:*",
    "vike": "0.4.266",
    "vike-vue": "0.9.13",
-    "vue": "3.5.43"
+    "vue": "3.5.44"
  },
  "devDependencies": {
-    "@vitejs/plugin-vue": "^6.0.8",
+    "@vitejs/plugin-vue": "^6.0.10",
    "@vitest/browser-playwright": "5.0.3",
    "typescript": "^6.0.3",
    "vite": "^8.3.2",
@@ -11,12 +11,12 @@
  },
  "dependencies": {
    "@lucide/vue": "workspace:*",
-    "vue": "3.5.43"
+    "vue": "3.5.44"
  },
  "devDependencies": {
    "@tsconfig/node24": "^24.0.5",
    "@types/node": "^26.1.1",
-    "@vitejs/plugin-vue": "^6.0.8",
+    "@vitejs/plugin-vue": "^6.0.10",
    "@vitest/browser-playwright": "5.0.3",
    "@vue/tsconfig": "^0.9.1",
    "playwright": "1.58.2",
@@ -1,26 +0,0 @@
-{
-  "$schema": "../icon.schema.json",
-  "contributors": [
-    "danielbayley"
-  ],
-  "tags": [
-    "fruit",
-    "snack",
-    "meal",
-    "lunch",
-    "ingredient",
-    "cooking",
-    "cookery",
-    "kitchen",
-    "cuisine",
-    "eating",
-    "healthy",
-    "nutrition",
-    "diet",
-    "guacamole",
-    "mexican"
-  ],
-  "categories": [
-    "food-beverage"
-  ]
-}
@@ -1,33 +0,0 @@
-{
-  "$schema": "../icon.schema.json",
-  "contributors": [
-    "danielbayley"
-  ],
-  "tags": [
-    "rashers",
-    "smoked",
-    "streaky",
-    "crispy",
-    "meat",
-    "fast food",
-    "junk food",
-    "snack",
-    "dish",
-    "restaurant",
-    "brunch",
-    "lunch",
-    "meal",
-    "savory",
-    "savoury",
-    "cookery",
-    "cooking",
-    "grilled",
-    "barbecue",
-    "barbeque",
-    "bbq",
-    "pig"
-  ],
-  "categories": [
-    "food-beverage"
-  ]
-}
@@ -9,7 +9,9 @@
    "test:integrations:solid": "pnpm --filter lucide-solid build && pnpm -r --workspace-concurrency=1 --filter './integrations/lucide-solid/**' check",
    "test:integrations:solid-2": "pnpm --filter @lucide/solid build && pnpm -r --workspace-concurrency=1 --filter './integrations/lucide-solid-2/**' check",
    "test:integrations:vue": "pnpm --filter @lucide/vue build && pnpm -r --workspace-concurrency=1 --filter './integrations/lucide-vue/**' check",
+    "test:integrations:svelte": "pnpm --filter @lucide/svelte build && pnpm -r --workspace-concurrency=1 --filter './integrations/lucide-svelte/**' check",
    "test:font": "pnpm --filter build-font test",
+    "test:scripts": "node --test scripts/*.test.mts",
    "lucide": "pnpm --filter lucide",
    "lucide-angular": "pnpm --filter lucide-angular",
    "lucide-react": "pnpm --filter lucide-react",
@@ -30,6 +32,7 @@
    "generate:sponsors": "node scripts/updateSponsors.mts",
    "generate:contributors": "node ./scripts/updateContributors.mts icons/*.svg",
    "generate:nextJSAliases": "node ./scripts/generateNextJSAliases.mts",
+    "icon-usage": "node ./scripts/iconUsage.mts",
    "suggest:metadata": "node ./scripts/suggestMetaData.mts",
    "suggest:metadata:debug": "node --env-file .env ./scripts/suggestMetaData.mts --debug",
    "suggest:metadata:watch": "node --env-file .env --watch ./scripts/suggestMetaData.mts",
@@ -44,16 +44,16 @@
  "devDependencies": {
    "@angular-eslint/builder": "~22.5.0",
    "@angular-eslint/schematics": "~22.5.0",
-    "@angular/build": "^22.2.1",
-    "@angular/cli": "^22.2.1",
-    "@angular/common": "^22.2.1",
-    "@angular/compiler": "^22.2.1",
-    "@angular/compiler-cli": "^22.2.1",
-    "@angular/core": "^22.2.1",
-    "@angular/forms": "^22.2.1",
-    "@angular/platform-browser": "^22.2.1",
-    "@angular/platform-server": "^22.2.1",
-    "@angular/router": "^22.2.1",
+    "@angular/build": "^22.2.2",
+    "@angular/cli": "^22.2.2",
+    "@angular/common": "^22.2.2",
+    "@angular/compiler": "^22.2.2",
+    "@angular/compiler-cli": "^22.2.2",
+    "@angular/core": "^22.2.2",
+    "@angular/forms": "^22.2.2",
+    "@angular/platform-browser": "^22.2.2",
+    "@angular/platform-server": "^22.2.2",
+    "@angular/router": "^22.2.2",
    "@lucide/build-icons": "workspace:*",
    "@lucide/helpers": "workspace:*",
    "@vitest/browser-playwright": "^5.0.3",
@@ -75,9 +75,9 @@
    "@types/react": "^19.3.0",
    "@vitejs/plugin-react": "^6.1.2",
    "jest-serializer-html": "^7.1.0",
-    "react": "19.3.0",
-    "react-dom": "19.3.0",
-    "react-native": "^0.87.1",
+    "react": "19.3.1",
+    "react-dom": "19.3.1",
+    "react-native": "^0.88.0",
    "react-native-svg": "^15.15.5",
    "rollup": "^4.63.1",
    "rollup-plugin-dts": "^6.5.1",
@@ -59,8 +59,8 @@
    "@types/react": "^19.3.0",
    "@vitejs/plugin-react": "^6.1.2",
    "jest-serializer-html": "^7.1.0",
-    "react": "19.3.0",
-    "react-dom": "19.3.0",
+    "react": "19.3.1",
+    "react-dom": "19.3.1",
    "rollup": "^4.63.1",
    "rollup-plugin-dts": "^6.5.1",
    "rollup-plugin-preserve-directives": "^0.4.0",
@@ -65,7 +65,7 @@
  "devDependencies": {
    "@lucide/build-icons": "workspace:*",
    "@lucide/helpers": "workspace:*",
-    "@sveltejs/package": "^3.0.0",
+    "@sveltejs/package": "^3.0.1",
    "@sveltejs/vite-plugin-svelte": "^7.3.1",
    "@testing-library/jest-dom": "^7.0.1",
    "@testing-library/svelte": "^5.4.2",
--- a/Show More
+++ b/Show More
				`@@ -0,0 +1 @@`
				// place files you want to import through the `#lib` alias in this folder.