Add bot-2 icon (#1544)

* Add bot-2 icon

* replace existing bot icon

.github/ISSUE_TEMPLATE/01_icon_request.yml

@@ -0,0 +1,49 @@
+name: Icon request
+description: Suggest a new icon for this project
+labels: ['🙌 icon request']
+body:
+  - type: markdown
+    attributes:
+      value: |
+        Before submitting an icon request check if it has already been requested. If there is an open request, please add a 👍.
+
+        **Important note**: No new brand logos are allowed, see https://github.com/lucide-icons/lucide/issues/670.
+        Existing brand icons will also be phased out. For brand icons, consider using https://simpleicons.org, which offers purpose-built SVGs that are also on a 24×24px grid.
+  - type: input
+    id: name
+    attributes:
+      label: Icon name
+      description: What should this icon depict? For multiple icons, provide a comma-separated list.
+    validations:
+      required: true
+  - type: textarea
+    id: use-cases
+    attributes:
+      label: Use cases
+      description: Why do you need this icon? Include at least two real-life use cases per requested icon, avoiding generic descriptions like "it's a car icon".
+      placeholder: e.g. I need a star icon to use in my rating system.
+    validations:
+      required: true
+  - type: textarea
+    id: design-ideas
+    attributes:
+      label: Design ideas
+      description: What should this icon look like? Provide simple, minimalistic icon examples from other sets or your own drafts to help us visualize your request.
+    validations:
+      required: true
+  - type: checkboxes
+    id: checklist
+    attributes:
+      label: Checklist
+      description: Please review the following checklist before submitting your request.
+      options:
+        - label: I have searched if someone has submitted a similar issue before and there weren't any. (Please make sure to also search closed issues, as this issue might already have been resolved.)
+          required: true
+        - label: I have searched existing icons to make sure it does not already exist and I didn't find any.
+          required: true
+        - label: I am not requesting a brand logo and the art is not protected by copyright.
+          required: true
+        - label: I am not requesting an icon that includes religious, political imagery or hate symbols.
+          required: true
+        - label: I have provided appropriate use cases for the icon(s) requested.
+          required: true

.github/ISSUE_TEMPLATE/02_bug_report.yml

@@ -0,0 +1,90 @@
+name: Bug report
+description: Create a report to help us improve
+labels: ['🐛 bug']
+body:
+  - type: markdown
+    attributes:
+      value: |
+        Before reporting an issue, please search to see if someone has filed a similar issue before. If there is already an open issue, please add a 👍 and/or leave a comment with additional information.
+  - type: checkboxes
+    id: packages
+    attributes:
+      label: Package
+      description: Which Lucide packages are affected? You may select more than one.
+      options:
+        - label: lucide
+        - label: lucide-angular
+        - label: lucide-flutter
+        - label: lucide-preact
+        - label: lucide-react
+        - label: lucide-react-native
+        - label: lucide-solid
+        - label: lucide-svelte
+        - label: lucide-vue
+        - label: lucide-vue-next
+        - label: Figma plugin
+        - label: source/main
+        - label: other/not relevant
+    validations:
+      required: true
+  - type: input
+    id: version
+    attributes:
+      label: Version
+      description: What version of Lucide are you running?
+      placeholder: e.g. 0.289.1
+    validations:
+      required: true
+  - type: checkboxes
+    id: browsers
+    attributes:
+      label: Browser
+      description: In which browser(s) are you experiencing the issue? You may select more than one.
+      options:
+        - label: Chrome/Chromium
+        - label: Firefox
+        - label: Safari
+        - label: Edge
+        - label: iOS Safari
+        - label: Opera
+        - label: Other/not relevant
+    validations:
+      required: false
+  - type: checkboxes
+    id: operating-systems
+    attributes:
+      label: Operating system
+      description: In which operating systems a you experiencing the issue? You may select more than one.
+      options:
+        - label: Windows
+        - label: Linux
+        - label: macOS
+        - label: Other/not relevant
+  - type: textarea
+    id: description
+    attributes:
+      label: Description
+      description: Try to describe in detail the problem you're running into and provide additional context about your working environment if necessary.
+      placeholder: e.g. When I do X, Y happens instead of Z
+    validations:
+      required: true
+  - type: textarea
+    id: steps-to-reproduce
+    attributes:
+      label: Steps to reproduce
+      description: Please provide a detailed guide on how this issue can be reproduced or a live example with a working reproduction on Codesandbox, JSFiddle or similar.
+      placeholder: |
+        1. Import `check` icon
+        2. Add to a React component/view
+        3. Run the react app
+        4. Notice that the `check` isn't rendering correctly which seems a encoding problem
+    validations:
+      required: true
+  - type: checkboxes
+    id: checklist
+    attributes:
+      label: Checklist
+      description: Please review the following checklist before submitting your issue.
+      options:
+        - label: I have searched if someone has submitted a similar issue before and there weren't any. (Please make sure to also search closed issues, as this issue might already have been resolved.)
+          required: true

.github/ISSUE_TEMPLATE/03_bug_report_site.yml

@@ -0,0 +1,62 @@
+name: lucide.dev bug report
+description: Help us improve the Lucide site
+labels: ['🐛 bug', '🌍 site']
+body:
+  - type: markdown
+    attributes:
+      value: |
+        Before reporting an issue, please search to see if someone has filed a similar issue before. If there is already an open issue, please add a 👍 and/or leave a comment with additional information.
+  - type: checkboxes
+    id: browsers
+    attributes:
+      label: Browser
+      description: In which browser(s) are you experiencing the issue? You may select more than one.
+      options:
+        - label: Chrome/Chromium
+        - label: Firefox
+        - label: Safari
+        - label: Edge
+        - label: iOS Safari
+        - label: Opera
+        - label: Other/not relevant
+    validations:
+      required: false
+  - type: checkboxes
+    id: operating-systems
+    attributes:
+      label: Operating system
+      description: In which operating systems are you experiencing the issue? You may select more than one.
+      options:
+        - label: Windows
+        - label: Linux
+        - label: macOS
+        - label: Other/not relevant
+  - type: textarea
+    id: description
+    attributes:
+      label: Description
+      description: Try to describe in detail the problem you're running into and provide additional context about your working environment if necessary.
+      placeholder: e.g. When I do X, Y happens instead of Z
+    validations:
+      required: true
+  - type: textarea
+    id: stepsToReproduce
+    attributes:
+      label: Steps to reproduce
+      description: Please provide a detailed guide on how this issue can be reproduced.
+      placeholder: |
+        1. I click on an icon
+        2. I click on `Copy SVG` in the drawer
+        3. I paste from the clipboard
+        4. A base64 encoded data URI is inserted.
+        ...
+    validations:
+      required: true
+  - type: checkboxes
+    id: checklist
+    attributes:
+      label: Checklist
+      description: Please review the following checklist before submitting your issue.
+      options:
+        - label: I have searched if someone has submitted a similar issue before and there weren't any. (Please make sure to also search closed issues, as this issue might already have been resolved.)
+          required: true

.github/ISSUE_TEMPLATE/04_feature_request.yml

@@ -0,0 +1,53 @@
+name: Feature request
+description: Share with us your ideas on how Lucide could be improved upon.
+labels: ['💡 idea']
+body:
+  - type: markdown
+    attributes:
+      value: |
+        Before submitting a new feature request, please search to see if someone has filed a similar request before. If there is already an open issue, please add a 👍 and/or leave a comment with additional information.
+  - type: checkboxes
+    id: packages
+    attributes:
+      label: Package
+      description: Which Lucide project do you wish this feature were added to? You may select more than one.
+      options:
+        - label: lucide
+        - label: lucide-angular
+        - label: lucide-flutter
+        - label: lucide-preact
+        - label: lucide-react
+        - label: lucide-react-native
+        - label: lucide-solid
+        - label: lucide-svelte
+        - label: lucide-vue
+        - label: lucide-vue-next
+        - label: Figma plugin
+        - label: all JS packages
+        - label: site
+    validations:
+      required: true
+  - type: textarea
+    id: description
+    attributes:
+      label: Description
+      description: Try to describe in detail the feature you wish existed.
+      placeholder: e.g. I want to be able to set extra CSS classes on icon components.
+    validations:
+      required: true
+  - type: textarea
+    id: use-cases
+    attributes:
+      label: Use cases
+      description: Why do you need this feature? Provide real-life use cases as to why this feature will be useful for others.
+      placeholder: e.g. I could use the extra classes to add animation or global custom styling to some icons.
+    validations:
+      required: true
+  - type: checkboxes
+    id: checklist
+    attributes:
+      label: Checklist
+      description: Please check the following items before submitting your issue.
+      options:
+        - label: I have searched the existing issues to make sure this bug has not already been reported.
+          required: true

.github/ISSUE_TEMPLATE/bug_report.md

@@ -1,68 +0,0 @@
----
-name: Bug report
-about: Create a report to help us improve
-labels: "🐛 bug"
----
-
-<!--
-Before reporting an issue, please search to see if someone has filed a similar issue before. If there is already an open issue, please add a 👍 and/or leave a comment with additional information.
--->
-
-## Prerequisites
-
-* Version:
-* Are you running from source/main:
-* Are you using a released build:
-* Operating system: 
-* Bits:
-
-## Step to reproduce
-
-*(Type here)*
-
-### Actual behavior
-
-## Any message or error
-
-*(Type here)*
-
-## Resources
-
-* Links
-* Screenshots
-
-
-Here is what a great bug report would look like:
-
-```
-## Prerequisites
-
-Version: Release v3.1.0
-Running from: Import using webpack
-Operating system: Mac OSX
-Bits: 64 bits
-
-## Step to reproduce
-
- - Import `check` icon
- - Add to a React component/view
- - Run the react app
- - Notice that the `check` isn't rendering correctly which seems a encoding problem
- 
-### Actual behavior:
-
- - Import `check` icon
- - Add to a React component/view
- - Run the react app
- - Check is displayed with correct encoding (e.g UTF-8)
-
-## Any message or error
-
-No console output
-...
-
-## Resources
-
-No resources
-...
-```

.github/ISSUE_TEMPLATE/icon_request.md

@@ -1,18 +0,0 @@
----
-name: Icon request
-about: Suggest an new icon for this project
-labels: "🙌 icon request"
----
-
-<!--
-Before creating an icon request, please search to see if someone has requested the icon already. If there is an open request, please add a 👍.
-A note about brand logos and related material : We follow the decision from Feather Icons (https://github.com/feathericons/feather/issues/763) to deprecate icons relating to brands.
-You will find some in the set, but we won't add any new ones. https://simpleicons.org has 24x24 SVG icons for this purpose.
-
--->
-
-## Icon Request
-
-* Icon name:
-* Use case:
-* _Screenshots_ of similar icons:

.github/PULL_REQUEST_TEMPLATE/new-icon.md

@@ -1,15 +0,0 @@
----
-name: New icon
-about: Add a new icon to the library
-labels: "🎨 <icon"
----
-
-<!-- Thanks for submitting an icon! Please make sure you read the icon design guide
-at https://github.com/lucide-icons/lucide/blob/main/docs/icon-design-guide.md beforehand,
-and please fill everything below. -->
-
-- **Name of the icon** : <!-- `icon` -->
-- **Tags (alternative names for this icon)** (add them in as a separate json file using the same icon name) :
-- **What is the purpose of this icon?** : <!-- Shows that one can click it to... / Is used to denote or label... -->
-- **100% scale preview** : <!-- upload an image -->
-- **Have you considered alternative possibilities** for its naming or design? :

.github/pull_request_template.md

@@ -0,0 +1,55 @@
+<!-- Thank you for contributing! -->
+
+<!-- Insert `closes #issueNumber` here if merging this PR will resolve an existing issue -->
+
+## What is the purpose of this pull request?
+<!-- Please choose one of the following, and put an "x" next to it. -->
+- [ ] New Icon
+- [ ] Bug fix
+- [ ] New Feature
+- [ ] Documentation update
+- [ ] Other:
+
+### Description
+<!-- Please insert your description here and provide info about the "what" this PR is contribution -->
+
+### Icon use case <!-- ONLY for new icons, remove this part if not icon PR -->
+<!-- What is the purpose of this icon? For each icon added, please insert at least two real life use cases (the more the better). Text like "it's a car icon" is not accepted. -->
+
+### Alternative icon designs <!-- ONLY for new icons, remove this part if not icon PR -->
+<!-- If you have any alternative icon designs, please attach them here. -->
+
+## Icon Design Checklist <!-- ONLY for new icons, remove this part if not icon PR -->
+
+### Concept <!-- ONLY for new icons -->
+<!-- All of these requirements must be fulfilled. -->
+- [ ] I have provided valid use cases for each icon.
+- [ ] I have not added any a brand or logo icon.
+- [ ] I have not used any hate symbols.
+- [ ] I have not included any religious or political imagery.
+
+### Author, credits & license<!-- ONLY for new icons. -->
+<!-- Please choose one of the following, and put an "x" next to it. -->
+- [ ] The icons are solely my own creation.
+- [ ] The icons were originally created in #<issueNumber> by @<githubUser>
+- [ ] I've based them on the following Lucide icons: <!-- provide the list of icons -->
+- [ ] I've based them on the following design: <!-- provide source URL and license permitting use -->
+
+### Naming <!-- ONLY for new icons -->
+<!-- All of these requirements must be fulfilled. -->
+- [ ] I've read and followed the [naming conventions](https://lucide.dev/guide/design/icon-design-guide#naming-conventions)
+- [ ] I've named icons by what they are rather than their use case.
+- [ ] I've provided meta JSON files in `icons/[iconName].json`.
+
+### Design <!-- ONLY for new icons -->
+<!-- All of these requirements must be fulfilled. -->
+- [ ] I've read and followed the [icon design guidelines](https://lucide.dev/guide/design/icon-design-guide)
+- [ ] I've made sure that the icons look sharp on low DPI displays.
+- [ ] I've made sure that the icons look consistent with the icon set in size, optical volume and density.
+- [ ] I've made sure that the icons are visually centered.
+- [ ] I've correctly optimized all icons to two points of precision.
+
+## Before Submitting <!-- For every PR! -->
+<!-- All of these requirements must be fulfilled. -->
+- [ ] I've read the [Contribution Guidelines](https://github.com/lucide-icons/lucide/blob/main/CONTRIBUTING.md).
+- [ ] I've checked if there was an existing PR that solves the same issue.

.github/workflows/ci.yml

@@ -10,8 +10,9 @@ on:
 jobs:
   create-release:
     if: github.repository == 'lucide-icons/lucide'
-
     runs-on: ubuntu-latest
+    outputs:
+      VERSION: ${{ steps.new-version.outputs.NEW_VERSION }}
 
     steps:
       - uses: actions/checkout@v3
@@ -63,8 +64,12 @@ jobs:
         id: change-log
         run: |
           CHANGE_LOG=$(pnpm run generate:changelog --old-tag=${{ steps.latest-tag.outputs.LATEST_TAG }})
+          CHANGE_LOG=$(tail -n +5 <<< $CHANGE_LOG)
           echo $CHANGE_LOG
-          echo "CHANGE_LOG=$CHANGE_LOG" >> $GITHUB_OUTPUT
+          EOF=$(dd if=/dev/urandom bs=15 count=1 status=none | base64)
+          echo "CHANGE_LOG<<$EOF" >> $GITHUB_OUTPUT
+          echo "$CHANGE_LOG" >> $GITHUB_OUTPUT
+          echo "$EOF" >> $GITHUB_OUTPUT
         env:
           GITHUB_API_KEY: ${{ secrets.GITHUB_TOKEN }}
 
@@ -80,7 +85,10 @@ jobs:
           name: New icons ${{ steps.new-version.outputs.NEW_VERSION }}
           body: ${{ steps.change-log.outputs.CHANGE_LOG }}
 
-      - name: Release packages
-        uses: './.github/workflows/release.yml'
-        with:
-          version: ${{ steps.new-version.outputs.NEW_VERSION }}
+  start-release:
+    if: github.repository == 'lucide-icons/lucide'
+    needs: create-release
+    uses: './.github/workflows/release.yml'
+    secrets: inherit
+    with:
+      version: ${{ needs.create-release.outputs.VERSION }}

.github/workflows/lucide-angular.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - packages/lucide-angular/**
+      - tools/build-icons/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide-font.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - icons/**
+      - tools/build-font/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide-preact.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - packages/lucide-preact/**
+      - tools/build-icons/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide-react-native.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - packages/lucide-react-native/**
+      - tools/build-icons/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide-react.yml

@@ -4,6 +4,8 @@ on:
   pull_request:
     paths:
       - packages/lucide-react/**
+      - tools/build-icons/**
+      - scripts/generateNextJSAliases.mjs
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide-solid.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - packages/lucide-solid/**
+      - tools/build-icons/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide-static.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - packages/lucide-static/**
+      - tools/build-icons/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide-svelte.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - packages/lucide-svelte/**
+      - tools/build-icons/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide-vue-next.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - packages/lucide-vue-next/**
+      - tools/build-icons/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide-vue.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - packages/lucide-vue/**
+      - tools/build-icons/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/lucide.yml

@@ -4,6 +4,7 @@ on:
   pull_request:
     paths:
       - packages/lucide/**
+      - tools/build-icons/**
       - pnpm-lock.yaml
 
 jobs:

.github/workflows/pull-request.yml

@@ -22,6 +22,20 @@ jobs:
         uses: tj-actions/changed-files@v35
         with:
           files: icons/*.svg
+      - name: Generate 24px dpi preview
+        id: generate-24px-dpi-preview
+        run: |
+          delimiter="$(openssl rand -hex 8)"
+          echo "body<<$delimiter" >> $GITHUB_OUTPUT
+          for file in ${{ steps.changed-files.outputs.all_changed_files }}; do
+            cat "$file" | # get file content
+            tr '\n' ' ' | # remove line breaks
+            sed -e 's/<svg[^>]*>/<svg>/g' | # remove attributes from svg element
+            base64 -w 0 | # encode svg
+            sed "s|.*|<img title=\"$file\" alt=\"$file\" src=\"https://lucide.dev/api/gh-icon/dpi/24/&.svg\"/> |"
+          done | tr '\n' ' ' >> $GITHUB_OUTPUT
+          echo >> $GITHUB_OUTPUT
+          echo "$delimiter" >> $GITHUB_OUTPUT
       - name: Generate cohesion check random
         id: generate-cohesion-check-random
         run: |
@@ -134,6 +148,10 @@ jobs:
             ${{ steps.generate-3px-stroke-width.outputs.body }}<br/>
             </details>
             <details>
+            <summary>DPI Preview (24px)</summary>
+            ${{ steps.generate-24px-dpi-preview.outputs.body }}<br/>
+            </details>
+            <details>
             <summary>Icon X-rays</summary>
             ${{ steps.generate-x-rays.outputs.body }}
             </details>

.github/workflows/release.yml

@@ -5,6 +5,13 @@ on:
     tags:
       - 'v*'
 
+  workflow_call:
+    inputs:
+      version:
+        required: true
+        description: Version
+        type: string
+
   workflow_dispatch:
     inputs:
       version:
@@ -25,7 +32,7 @@ jobs:
           echo $VERSION_REF
           echo "VERSION=${VERSION_REF/refs\/tags\/\v}" >> $GITHUB_OUTPUT
         env:
-          VERSION_REF: ${{ github.event.inputs.version || github.ref }}
+          VERSION_REF: ${{ inputs.version || github.event.inputs.version || github.ref }}
 
   release:
     if: github.repository == 'lucide-icons/lucide'
@@ -74,7 +81,7 @@ jobs:
         run: pnpm install --frozen-lockfile
 
       - name: Set Auth Token
-        run: npm config set //registry.npmjs.org/:_authToken ${{ secrets.NPM_TOKEN }}
+        run: npm config set //registry.npmjs.org/:_authToken ${{ inputs.NPM_TOKEN || secrets.NPM_TOKEN }}
 
       - name: Set new version
         run: pnpm --filter ${{ matrix.package }} version --new-version ${{ needs.pre-release.outputs.VERSION }} --no-git-tag-version
@@ -196,8 +203,8 @@ jobs:
     ]
 
     steps:
+      - uses: actions/checkout@v3
       - uses: actions/download-artifact@v2
-
       - name: Zip font and icons
         run: |
           zip -r lucide-font-${{ needs.pre-release.outputs.VERSION }}.zip lucide-font
@@ -206,7 +213,7 @@ jobs:
       - name: Release zip and fonts
         uses: softprops/action-gh-release@v1
         with:
-          tag_name: v${{ needs.pre-release.outputs.VERSION }}
+          tag_name: ${{ needs.pre-release.outputs.VERSION }}
           files: |
             lucide-font-${{ needs.pre-release.outputs.VERSION }}.zip
             lucide-icons-${{ needs.pre-release.outputs.VERSION }}.zip

.gitignore

@@ -17,6 +17,10 @@ packages/**/src/icons/*.js
 packages/**/src/icons/*.ts
 packages/**/src/icons/*.tsx
 packages/**/src/aliases.ts
+packages/**/src/dynamicIconImports.ts
+packages/**/dynamicIconImports.js
+packages/**/dynamicIconImports.d.ts
+packages/**/dynamicIconImports.js.map
 packages/**/LICENSE
 categories.json
 tags.json

README.md

@@ -286,5 +286,5 @@ Thank you to all the people who contributed to Lucide!
 ## Sponsors
 
 <a href="https://vercel.com?utm_source=lucide&utm_campaign=oss">
-  <img src="./site/public/vercel.svg" alt="Powered by Vercel" width="200" />
+  <img src="/docs/public/vercel.svg" alt="Powered by Vercel" width="200" />
 </a>

categories/transportation.json

@@ -1,5 +1,5 @@
 {
   "$schema": "../category.schema.json",
   "title": "Transportation",
-  "icon": "train"
+  "icon": "train-front"
 }

docs/.vitepress/api/gh-icon/dpi/[...data].get.ts

@@ -0,0 +1,73 @@
+import { eventHandler, setResponseHeader, defaultContentType } from 'h3';
+import { Resvg, initWasm } from '@resvg/resvg-wasm';
+import wasm from './loadWasm';
+
+var initializedResvg = initWasm(wasm);
+
+export default eventHandler(async (event) => {
+  const { params = {} } = event.context;
+  await initializedResvg;
+
+  const imageSize = 96;
+  const [iconSizeString, svgData] = params.data.split('/');
+  const iconSize = parseInt(iconSizeString, 10);
+  const data = svgData.slice(0, -4);
+
+  const src = Buffer.from(data, 'base64').toString('utf8');
+  const svg = (src.includes('<svg') ? src : `<svg>${src}</svg>`)
+    .replace(/(\r\n|\n|\r)/gm, '')
+    .replace(
+      /<svg[^>]*/,
+      `<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="${iconSize}"
+  height="${iconSize}"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="#fff"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+`
+    );
+
+  const resvg = new Resvg(svg, { background: '#000' });
+  const pngData = resvg.render();
+  const pngBuffer = Buffer.from(pngData.asPng());
+
+  defaultContentType(event, 'image/svg+xml');
+  setResponseHeader(event, 'Cache-Control', 'public,max-age=31536000');
+
+  return `
+<svg xmlns="http://www.w3.org/2000/svg" width="${imageSize}" height="${imageSize}" viewBox="0 0 ${imageSize} ${imageSize}">
+  <style>
+    @media screen and (prefers-color-scheme: light) {
+      #fallback-background { fill: transparent; }
+    }
+    @media screen and (prefers-color-scheme: dark) {
+      #fallback-background { fill: transparent; }
+      rect { fill: #fff; }
+    }
+  </style>
+  <mask id="mask">
+    <image
+      width="${imageSize}"
+      height="${imageSize}"
+      href="data:image/png;base64,${pngBuffer.toString('base64')}"
+      image-rendering="pixelated"
+    />
+  </mask>
+  <rect
+    id="fallback-background"
+    width="${imageSize}"
+    height="${imageSize}" ry="${imageSize / 24}"
+    fill="#fff"
+  />
+  <rect
+    width="${imageSize}"
+    height="${imageSize}"
+    fill="#000"
+    mask="url(#mask)"
+  />
+</svg>`;
+});

docs/.vitepress/api/gh-icon/dpi/loadWasm.ts

@@ -0,0 +1,15 @@
+import fs from 'fs';
+import module from 'node:module';
+/* WASM_IMPORT */
+
+let wasm;
+
+if (process.env.NODE_ENV === 'development') {
+  const require = module.createRequire(import.meta.url);
+
+  wasm = fs.readFileSync(require.resolve('@resvg/resvg-wasm/index_bg.wasm'));
+} else {
+  wasm = resvg_wasm;
+}
+
+export default wasm;

docs/.vitepress/api/gh-icon/stroke-width/[...data].get.ts

@@ -22,10 +22,19 @@ export default eventHandler((event) => {
 
   const svg = Buffer.from(
     // We can't use jsx here, is not supported here by nitro.
-    renderToString(createElement(Icon, { strokeWidth })).replace(
-      />/,
-      '><style>@media screen and (prefers-color-scheme: dark) { svg { stroke: #fff } }</style>'
-    )
+    renderToString(createElement(Icon, { strokeWidth }))
+      .replace(/fill\="none"/, 'fill="#fff"')
+      .replace(
+        />/,
+        `><style>
+        @media screen and (prefers-color-scheme: light) {
+          svg { fill: transparent !important; }
+        }
+        @media screen and (prefers-color-scheme: dark) {
+          svg { stroke: #fff; fill: transparent !important; }
+        }
+      </style>`
+      )
   ).toString('utf8');
 
   defaultContentType(event, 'image/svg+xml')

docs/.vitepress/config.ts

@@ -1,14 +1,6 @@
 import { fileURLToPath, URL } from 'node:url'
-import path from 'path';
 import { defineConfig } from 'vitepress'
-import { createWriteStream } from 'node:fs'
-import { resolve } from 'node:path'
-import { SitemapStream } from 'sitemap'
 import sidebar from './sidebar';
-import fs from 'fs';
-
-const links = []
-
 
 const title = "Lucide";
 const socialTitle = "Lucide Icons";
@@ -20,6 +12,7 @@ export default defineConfig({
   description,
   cleanUrls: true,
   outDir: '.vercel/output/static',
+  srcExclude: ['**/README.md'],
   vite: {
     resolve: {
       alias: [
@@ -40,7 +33,7 @@ export default defineConfig({
   },
   head: [
     [ 'script', {
-      src: 'https://plausible.io/js/script.js',
+      src: 'https://analytics.lucide.dev/js/script.js',
       'data-domain': 'lucide.dev',
       defer: ''
     }],
@@ -126,32 +119,7 @@ export default defineConfig({
       pattern: 'https://github.com/lucide-icons/lucide/edit/main/docs/:path'
     },
   },
-  transformHtml: (_, id, { pageData }) => {
-    if (/[\\/]404\.html$/.test(id)) {
-      return
-    }
-
-    if (pageData.relativePath.startsWith('icons/')) {
-      links.push({
-        url: pageData.relativePath.replace(/((^|\/)index)?\.md$/, '$2'),
-        lastmod: pageData?.params?.changedRelease?.date
-      })
-      return
-    }
-
-    links.push({
-      url: pageData.relativePath.replace(/((^|\/)index)?\.md$/, '$2'),
-      lastmod: pageData.lastUpdated
-    })
-  },
-  buildEnd: async ({ outDir }) => {
-    const sitemap = new SitemapStream({
-      hostname: 'https://lucide.dev/'
-    })
-    const writeStream = createWriteStream(resolve(outDir, 'sitemap.xml'))
-    sitemap.pipe(writeStream)
-    links.forEach((link) => sitemap.write(link))
-    sitemap.end()
-    await new Promise((r) => writeStream.on('finish', r))
-  },
+  sitemap: {
+    hostname: 'https://lucide.dev/'
+  }
 })

docs/.vitepress/lib/SvgPreview/index.tsx

@@ -4,7 +4,7 @@ import { getPaths, assert } from './utils';
 
 const Grid = ({
   radius,
-  fill,
+  fill = '#fff',
   ...props
 }: {
   strokeWidth: number;
@@ -12,6 +12,7 @@ const Grid = ({
 } & PathProps<'stroke', 'strokeWidth'>) => (
   <g className="svg-preview-grid-group" strokeLinecap="butt" {...props}>
     <rect
+      className="svg-preview-grid-rect"
       width={24 - props.strokeWidth}
       height={24 - props.strokeWidth}
       x={props.strokeWidth / 2}
@@ -207,7 +208,12 @@ const SvgPreview = React.forwardRef<
 >(({ src, children, showGrid = false, ...props }, ref) => {
   const paths = typeof src === 'string' ? getPaths(src) : src;
 
-  const darkModeCss = `@media screen and (prefers-color-scheme: dark) {
+  const darkModeCss = `@media screen and (prefers-color-scheme: light) {
+  .svg-preview-grid-rect { fill: none }
+}
+@media screen and (prefers-color-scheme: dark) {
+  .svg-preview-grid-rect { fill: none }
+  .svg
   .svg-preview-grid-group,
   .svg-preview-radii-group,
   .svg-preview-shadow-mask-group,

docs/.vitepress/lib/createCodeExamples.ts

@@ -24,7 +24,7 @@ const getIconCodes = (): CodeExampleType => {
       codes: [
         {
           language: 'html',
-          code: `<i data-lucide-name="Name"></i>
+          code: `<i data-lucide="Name"></i>
 `,
         },
       ],

docs/.vitepress/vue-shim.d.ts

@@ -1,10 +1,18 @@
-declare module "*.vue" {
-  import Vue from "vue";
+declare module '*.vue' {
+  import Vue from 'vue';
   export default Vue;
 }
 
-declare module "*.data.ts" {
+declare module '*.data.ts' {
   const data: any;
 
   export { data };
 }
+
+declare module '*.wasm' {}
+
+declare const resvg_wasm: RequestInfo | URL | Response | BufferSource | WebAssembly.Module;
+
+declare module 'node:module' {
+  function createRequire(filename: string): NodeRequire;
+}

docs/README.md

@@ -3,8 +3,6 @@
 The Lucide docs website is built with Vitepress: https://vitepress.dev/
 This is Markdown-based documentation powered by Vue.
 
-This is why this file is in txt format.
-
 ## Development
 
 ```sh

docs/guide/design/icon-design-guide.md

@@ -2,60 +2,113 @@
 title: Icon Design Guide
 ---
 
-# Icon Design Principles
+## Icon Design Principles
 
 Here are rules that should be followed to keep quality and consistency when making icons for Lucide.
 
-## Summary of the rules we have
-
-1. Icons must be designed on a **24 by 24 pixels** canvas.
-2. Icons must have at least **1 pixel padding** within the canvas.
-3. Icons must have a **stroke width of 2 pixels**.
-4. Icons must use **round joins**.
-5. Icons must use **round caps**.
-6. Icons must use **centered strokes**.
-7. Shapes (such as rectangles) in icons must have **border radius of 2 pixels**.
-8. Distinct elements must have **2 pixels of spacing between each other**.
-
-## The Rules Visualized
-
-### 1. Icons must be designed on a 24 by 24 pixels canvas.
+### 1. Icons must be designed on a **24 by 24 pixels** canvas.
 
 ![24px-24px](../../images/24px-24px.svg?raw=true "24px-24px")
 
-### 2. Icons must have at least 1 pixel padding within the canvas.
+### 2. Icons must have at least **1 pixel padding** within the canvas.
 
 ![1px-padding](../../images/1px-padding.svg?raw=true "1px-padding")
 
-### 3. Icons must have a stroke width of 2 pixels.
+### 3. Icons must have a **stroke width of 2 pixels**.
 
 ![2px-stroke](../../images/2px-stroke.svg?raw=true "2px-stroke")
 
-### 4. Icons must use round joins.
+### 4. Icons must use **round joins**.
 
 ![round-joints](../../images/round-joints.svg?raw=true "round-joints")
 
-### 5. Icons must use round caps.
+### 5. Icons must use **round caps**.
 
 ![round-caps](../../images/round-caps.svg?raw=true "round-caps")
 
-### 6. Icons must use centered strokes.
+### 6. Icons must use **centered strokes**.
 
 ![centered-strokes](../../images/centered-strokes.svg?raw=true "centered-strokes")
 
-### 7. Shapes (such as squares) in icons must have border radius of 2 pixels.
+### 7. Shapes (such as rectangles) must have a **border radius of**
+
+#### A. **2 pixels** if they are at least 8 pixels in size
 
 ![2px-border-radius](../../images/2px-border-radius.svg?raw=true "2px-border-radius")
 
-### 8. Distinct elements must have 2 pixels of spacing between each other.
+#### B. **1 pixel** if they are smaller than 8 pixels in size
+
+![1px-border-radius](../../images/1px-border-radius.svg?raw=true "1px-border-radius")
+
+### 8. Distinct elements must have **2 pixels of spacing between each other**
 
 ![2px-element-spacing](../../images/2px-element-spacing.svg?raw=true "2px-element-spacing")
 
+### 9. Icons should have a similar optical volume to `circle` and `square`.
+
+![optical-volume-ideal](../../images/optical-volume-ideal.svg?raw=true "optical-volume-ideal")
+
+![optical-volume-low](../../images/optical-volume-low.svg?raw=true "optical-volume-low")
+
+![optical-volume-high](../../images/optical-volume-high.svg?raw=true "optical-volume-high")
+
+**Tip:** place your icon next to circle or square and blur them both; your icon should not feel much darker than the base shape.
+
+### 10. Icons should be visually centered by their center of gravity.
+
+![visually-centered](../../images/visually-centered.svg?raw=true "visually-centered")
+
+![visually-centered-bad](../../images/visually-centered-bad.svg?raw=true "visually-centered-bad")
+
+**Tip:** place your icon both above/below and next to the square or circle icon and check if it feels off center. Symmetrical icons should always be aligned to the center.
+
+### 11. Icons should have similar visual density and level of detail.
+
+![density-ideal](../../images/density-ideal.svg?raw=true "density-ideal")
+
+![density-high](../../images/density-high.svg?raw=true "density-high")
+
+**Tip:** try to make abstractions to dense elements. Blur your icon, and when blurred it should not feel overly dark.
+
+### 12. Continuous curves should join smoothly.
+
+![curvature-smooth](../../images/curvature-smooth.svg?raw=true "curvature-smooth")
+
+![curvature-uneven](../../images/curvature-uneven.svg?raw=true "curvature-uneven")
+
+**Tip:** make sure to use arcs or quadratic curves, when using cubic curves control points should have mirrored angles for smooth curves.
+
+### 13. Icons should aim to be pixel perfect so that they will be sharp on low DPI displays.
+
+![pixel-perfection-ideal](../../images/pixel-perfection-ideal.svg?raw=true "pixel-perfection-ideal")
+
+![pixel-perfection-bad](../../images/pixel-perfection-bad.svg?raw=true "pixel-perfection-bad")
+
+**Tip:** whenever possible align elements and arc centers to the grid.
+
+## Naming conventions
+
+1. Icon names use lower kebab case.\
+   For example: `arrow-up` instead of `Arrow Up`.
+
+2. Icon names use International English names, as opposed to local variants.\
+   For example:  `color` instead of `colour`.
+
+3. Icons should be named for what they depict rather than their use case or what they represent.\
+   For example: `floppy-disk` instead of `save` and `circle-slash` rather than `ban`.
+
+4. Icons that are part of a group are named `<group>-<variant>`.\
+   For example: `badge-plus` is based on `badge`.
+
+5. Icon names for alternate icons should represent what makes the alternate unique instead of being numbered.\
+   For example: `send-horizontal` instead of `send-2`.
+
+6. Names containing numerals are not allowed, unless the number itself is represented in the icon.\
+   For example: `arrow-down-0-to-1` contains both numerals.
+
 ## Code Conventions
 
-Before an icon is added to the library, we like to have readable and optimized svg code.
-
-Never use [`<use>`](https://developer.mozilla.org/en-US/docs/Web/SVG/Element/use). While it may sometimes seem like a good way to optimize file size, there's no way to ensure that the referenced element IDs will be unique once the SVGs are embedded in HTML documents.
+Before an icon is added to the library, we like to have readable and optimized SVG code.
 
 ### Global Attributes
 
@@ -79,11 +132,26 @@ For each icon these attributes are applied, corresponding to the above rules.
 
 ### Minify paths
 
-Code of paths can get really big.
-To reduce file size we like to minify the code.
-We recommend to use the [SVGOMG](https://jakearchibald.github.io/svgomg/) to minify paths.
+The code of paths can sometimes get quite large. To reduce file size we like to minify the code.
+We recommend to use the [SVGOMG](https://jakearchibald.github.io/svgomg/) to minify paths to 2 points of precision.
 
-### JSON metadata descriptor
+### Allowed elements
+
+SVG files may only contain simple path and shape elements, which may not have any attributes other than sizing and spacing.\
+In practice only the following elements and attributes are allowed:
+* `<path d>`
+* `<line x1 x2>`
+* `<polygon points>`
+* `<polyline points>`
+* `<circle cx cy r>`
+* `<ellipse cx cy rx ry>`
+* `<rect x y width height rx>`
+
+This also means that no transforms, filters, fills or explicit strokes are allowed.
+
+Never use [`<use>`](https://developer.mozilla.org/en-US/docs/Web/SVG/Element/use). While it may sometimes seem like a good way to optimize file size, there's no way to ensure that the referenced element IDs will be unique once the SVGs are embedded in HTML documents.
+
+## JSON metadata descriptor
 
 Each icon added must also come with a matching JSON file listing tags and categories for the icon.
 Please use the following template:
@@ -91,6 +159,10 @@ Please use the following template:
 ```json
 {
   "$schema": "../icon.schema.json",
+  "contributors": [
+    "github-username",
+    "another-github-username"
+  ],
   "tags": [
     "foo",
     "bar"

docs/guide/packages/lucide-preact.md

@@ -26,9 +26,9 @@ npm install lucide-preact
 
 ## How to use
 
-It's build with ES Modules so it's completely tree-shakable.
+Lucide is built with ES Modules, so it's completely tree-shakable.
 
-Each icon can be imported as a Preact component, what renders a inline SVG Element. This way only the icons that are imported into your project are included in the final bundle. The rest of the icons are tree-shaken away.
+Each icon can be imported as a Preact component, which renders an inline SVG element. This way, only the icons that are imported into your project are included in the final bundle. The rest of the icons are tree-shaken away.
 
 ### Example
 
@@ -56,7 +56,7 @@ export default App;
 
 ### Applying props
 
-To apply custom props to change the look of the icon, this can be done by simply pass them as props to the component. All SVG attributes are available as props to style the SVGs. See the list of SVG Presentation Attributes on [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/Presentation).
+To customize the appearance of an icon, you can pass custom properties as props directly to the component. The component accepts all SVG attributes as props, which allows flexible styling of the SVG elements. See the list of SVG Presentation Attributes on [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/Presentation).
 
 ```jsx
 // Usage
@@ -69,10 +69,10 @@ const App = () => {
 
 ## One generic icon component
 
-It is possible to create one generic icon component to load icons. It's not recommended.
+It is possible to create one generic icon component to load icons, but it is not recommended.
 
 ::: danger
-Example below importing all ES Modules, caution using this example. All icons will be imported. When using bundlers like: `Webpack`, `Rollup` or `Vite` the application build size will grow strongly and harming the performance the application.
+The example below imports all ES Modules, so exercise caution when using it. Importing all icons will significantly increase the build size of the application, negatively affecting its performance. This is especially important when using bundlers like `Webpack`, `Rollup`, or `Vite`.
 :::
 
 ### Icon Component Example

docs/guide/packages/lucide-react-native.md

@@ -52,7 +52,7 @@ export default App;
 
 ### Applying props
 
-To apply custom props to change the look of the icon, this can be done by simply pass them as props to the component.
+To customize the appearance of an icon, you can pass custom properties as props directly to the component. The component accepts all SVG attributes as props, which allows flexible styling of the SVG elements.
 
 ```jsx
 // Usage
@@ -63,10 +63,10 @@ const App = () => {
 
 ## One generic icon component
 
-It is possible to create one generic icon component to load icons.
+It is possible to create one generic icon component to load icons, but it is not recommended.
 
 ::: warning
-Example below importing all ES Modules, caution using this example. All icons will be imported. When using bundlers like: `Webpack`, `Rollup` or `Vite` the application build size will grow strongly and harming the performance the application.
+The example below imports all ES Modules, so exercise caution when using it. Importing all icons will significantly increase the build size of the application, negatively affecting its performance. This is especially important  to keep in mind when using bundlers like `Webpack`, `Rollup`, or `Vite`.
 :::
 
 ### Icon Component Example

docs/guide/packages/lucide-react.md

@@ -22,9 +22,9 @@ npm install lucide-react
 
 ## How to use
 
-It's build with ES Modules so it's completely tree-shakable.
+Lucide is built with ES Modules, so it's completely tree-shakable.
 
-Each icon can be imported as a React component, what renders a inline SVG Element. This way only the icons that are imported into your project are included in the final bundle. The rest of the icons are tree-shaken away.
+Each icon can be imported as a React component, which renders an inline SVG element. This way, only the icons that are imported into your project are included in the final bundle. The rest of the icons are tree-shaken away.
 
 ### Example
 
@@ -52,7 +52,7 @@ export default App;
 
 ### Applying props
 
-To apply custom props to change the look of the icon, this can be done by simply pass them as props to the component. All SVG attributes are available as props to style the SVGs. See the list of SVG Presentation Attributes on [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/Presentation).
+To customize the appearance of an icon, you can pass custom properties as props directly to the component. The component accepts all SVG attributes as props, which allows flexible styling of the SVG elements. See the list of SVG Presentation Attributes on [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/Presentation).
 
 ```jsx
 // Usage
@@ -63,10 +63,12 @@ const App = () => {
 
 ## One generic icon component
 
-It is possible to create one generic icon component to load icons. It's not recommended.
+It is possible to create one generic icon component to load icons, but it is not recommended.
 
 ::: danger
-Example below importing all ES Modules, caution using this example. All icons will be imported. When using bundlers like: `Webpack`, `Rollup` or `Vite` the application build size will grow strongly and harming the performance the application.
+The example below imports all ES Modules, so exercise caution when using it. Importing all icons will significantly increase the build size of the application, negatively affecting its performance. This is especially important to keep in mind when using bundlers like `Webpack`, `Rollup`, or `Vite`.
+
+This is not the case for the latest NextJS, because it uses server side rendering. The icons will be streamed to the client when needed. For NextJS with Dynamic Imports, see [dynamic imports](#nextjs-example) section for more information.
 :::
 
 ### Icon Component Example
@@ -94,3 +96,60 @@ const App = () => {
 
 export default App;
 ```
+
+#### With Dynamic Imports
+
+> :warning: This is experimental and only works with bundlers that support dynamic imports.
+
+Lucide react exports a dynamic import map `dynamicIconImports`, which is useful for applications that want to show icons dynamically by icon name. For example, when using a content management system with where icon names are stored in a database.
+
+When using client side rendering, it will fetch the icon component when it's needed. This will reduce the initial bundle size.
+
+The keys of the dynamic import map are the lucide original icon names (kebab case).
+
+Example with React suspense:
+
+```tsx
+import React, { lazy, Suspense } from 'react';
+import { dynamicIconImports, LucideProps } from 'lucide-react';
+
+const fallback = <div style={{ background: '#ddd', width: 24, height: 24 }}/>
+
+interface IconProps extends Omit<LucideProps, 'ref'> {
+  name: keyof typeof dynamicIconImports;
+}
+
+const Icon = ({ name, ...props }: IconProps) => {
+  const LucideIcon = lazy(dynamicIconImports[name]);
+
+  return (
+    <Suspense fallback={fallback}>
+      <LucideIcon {...props} />
+    </Suspense>
+  );
+}
+
+export default Icon
+```
+
+##### NextJS Example
+
+In NextJS [the dynamic function](https://nextjs.org/docs/pages/building-your-application/optimizing/lazy-loading#nextdynamic) can be used to load the icon component dynamically.
+
+```tsx
+import dynamic from 'next/dynamic'
+import { LucideProps } from 'lucide-react';
+import dynamicIconImports from 'lucide-react/dynamicIconImports';
+
+interface IconProps extends LucideProps {
+  name: keyof typeof dynamicIconImports;
+}
+
+const Icon = ({ name, ...props }: IconProps) => {
+  const LucideIcon = dynamic(dynamicIconImports[name])
+
+  return <LucideIcon {...props} />;
+};
+
+export default Icon;
+```

docs/guide/packages/lucide-solid.md

@@ -22,9 +22,9 @@ npm install lucide-solid
 
 ## How to use
 
-It's build with ES Modules so it's completely tree-shakable.
+Lucide is built with ES Modules, so it's completely tree-shakable.
 
-Each icon can be imported as a Solid component, what renders a inline SVG Element. This way only the icons that are imported into your project are included in the final bundle. The rest of the icons are tree-shaken away.
+Each icon can be imported as a Solid component, which renders an inline SVG element. This way, only the icons that are imported into your project are included in the final bundle. The rest of the icons are tree-shaken away.
 
 ### Example
 
@@ -52,7 +52,7 @@ export default App;
 
 ### Applying props
 
-To apply custom props to change the look of the icon, this can be done by simply pass them as props to the component. All SVG attributes are available as props to style the SVGs. See the list of SVG Presentation Attributes on [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/Presentation).
+To customize the appearance of an icon, you can pass custom properties as props directly to the component. The component accepts all SVG attributes as props, which allows flexible styling of the SVG elements. See the list of SVG Presentation Attributes on [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/Presentation).
 
 ```jsx
 // Usage
@@ -66,7 +66,7 @@ const App = () => {
 It is possible to create one generic icon component to load icons. It's not recommended.
 
 ::: danger
-Example below importing all ES Modules, caution using this example. All icons will be imported. When using bundlers like: `Webpack`, `Rollup` or `Vite` the application build size will grow strongly and harming the performance the application.
+The example below imports all ES Modules, so exercise caution when using it. Importing all icons will significantly increase the build size of the application, negatively affecting its performance. This is especially important  to keep in mind when using bundlers like `Webpack`, `Rollup`, or `Vite`.
 :::
 
 ### Icon Component Example

docs/guide/packages/lucide-svelte.md

@@ -22,9 +22,9 @@ npm install lucide-svelte
 
 ## How to use
 
-It's build with ES Modules so it's completely tree-shakable.
+Lucide is built with ES Modules, so it's completely tree-shakable.
 
-Each icon can be imported as a Svelte component, what renders a inline SVG Element. This way only the icons that are imported into your project are included in the final bundle. The rest of the icons are tree-shaken away.
+Each icon can be imported as a Svelte component, which renders an inline SVG element. This way, only the icons that are imported into your project are included in the final bundle. The rest of the icons are tree-shaken away.
 
 ### Example
 
@@ -59,7 +59,7 @@ Additional props can be passed to adjust the icon:
 
 ### Applying props
 
-To apply custom props to change the look of the icon, this can be done by simply pass them as props to the component. All SVG attributes are available as props to style the SVGs. See the list of SVG Presentation Attributes on [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/Presentation).
+To customize the appearance of an icon, you can pass custom properties as props directly to the component. The component accepts all SVG attributes as props, which allows flexible styling of the SVG elements. See the list of SVG Presentation Attributes on [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/Presentation).
 
 ```svelte
 <script>
@@ -73,10 +73,10 @@ This results a filled phone icon.
 
 ## One generic icon component
 
-It is possible to create one generic icon component to load icons. It's not recommended.
+It is possible to create one generic icon component to load icons, but it is not recommended.
 
 ::: danger
-Example below importing all ES Modules, caution using this example. All icons will be imported. When using bundlers like: `Webpack`, `Rollup` or `Vite` the application build size will grow strongly and harming the performance the application.
+The example below imports all ES Modules, so exercise caution when using it. Importing all icons will significantly increase the build size of the application, negatively affecting its performance. This is especially important when using bundlers like `Webpack`, `Rollup`, or `Vite`.
 :::
 
 ### Icon Component Example

docs/guide/packages/lucide-vue-next.md

@@ -28,9 +28,9 @@ npm install lucide-vue-next
 
 ## How to use
 
-It's build with ES Modules so it's completely tree-shakable.
+Lucide is built with ES Modules, so it's completely tree-shakable.
 
-Each icon can be imported as a Vue component, what renders a inline SVG Element. This way only the icons that are imported into your project are included in the final bundle. The rest of the icons are tree-shaken away.
+Each icon can be imported as a Vue component, which renders an inline SVG Element. This way only the icons that are imported into your project are included in the final bundle. The rest of the icons are tree-shaken away.
 
 ### Example
 
@@ -61,7 +61,7 @@ import { Camera } from 'lucide-vue-next';
 
 ### Applying props
 
-To apply custom props to change the look of the icon, this can be done by simply pass them as props to the component. All SVG attributes are available as props to style the SVGs. See the list of SVG Presentation Attributes on [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/Presentation).
+To customize the appearance of an icon, you can pass custom properties as props directly to the component. The component accepts all SVG attributes as props, which allows flexible styling of the SVG elements. See the list of SVG Presentation Attributes on [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/Presentation).
 
 ```vue
 <template>
@@ -71,10 +71,10 @@ To apply custom props to change the look of the icon, this can be done by simply
 
 ## One generic icon component
 
-It is possible to create one generic icon component to load icons. It's not recommended.
+It is possible to create one generic icon component to load icons, but it is not recommended.
 
 ::: danger
-Example below importing all ES Modules, caution using this example. All icons will be imported. When using bundlers like: `Webpack`, `Rollup` or `Vite` the application build size will grow strongly and harming the performance the application.
+The example below imports all ES Modules, so exercise caution when using it. Importing all icons will significantly increase the build size of the application, negatively affecting its performance. This is especially important when using bundlers like `Webpack`, `Rollup`, or `Vite`.
 :::
 
 ### Icon Component Example

docs/guide/packages/lucide-vue.md

@@ -28,9 +28,9 @@ npm install lucide-vue
 
 ## How to use
 
-It's build with ES Modules so it's completely tree-shakable.
+Lucide is built with ES Modules, so it's completely tree-shakable.
 
-Each icon can be imported as a Vue component, what renders a inline SVG Element. This way only the icons that are imported into your project are included in the final bundle. The rest of the icons are tree-shaken away.
+Each icon can be imported as a Vue component, which renders an inline SVG Element. This way only the icons that are imported into your project are included in the final bundle. The rest of the icons are tree-shaken away.
 
 ### Example
 
@@ -63,7 +63,7 @@ Additional props can be passed to adjust the icon:
 
 ### Applying props
 
-To apply custom props to change the look of the icon, this can be done by simply pass them as props to the component. All SVG attributes are available as props to style the SVGs. See the list of SVG Presentation Attributes on [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/Presentation).
+To customize the appearance of an icon, you can pass custom properties as props directly to the component. The component accepts all SVG attributes as props, which allows flexible styling of the SVG elements. See the list of SVG Presentation Attributes on [MDN](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/Presentation).
 
 ```vue
 <template>
@@ -73,10 +73,10 @@ To apply custom props to change the look of the icon, this can be done by simply
 
 ## One generic icon component
 
-It is possible to create one generic icon component to load icons. It's not recommended.
+It is possible to create one generic icon component to load icons, but it is not recommended.
 
 ::: danger
-Example below importing all ES Modules, caution using this example. All icons will be imported. When using bundlers like: `Webpack`, `Rollup` or `Vite` the application build size will grow strongly and harming the performance the application.
+The example below imports all ES Modules, so exercise caution when using it. Importing all icons will significantly increase the build size of the application, negatively affecting its performance. This is especially important when using bundlers like `Webpack`, `Rollup`, or `Vite`.
 :::
 
 ### Icon Component Example

docs/nitro.config.ts

@@ -1,4 +1,5 @@
-import { defineNitroConfig } from "nitropack";
+import copy from 'rollup-plugin-copy';
+import replace from '@rollup/plugin-replace';
 
 export default defineNitroConfig({
   preset: 'vercel-edge',
@@ -6,15 +7,29 @@ export default defineNitroConfig({
   routeRules: {
     '/api/**': { cors: false },
   },
+  rollupConfig: {
+    external: ['@resvg/resvg-wasm/index_bg.wasm', './index_bg.wasm?module'],
+    plugins: [
+      copy({
+        targets: [
+          {
+            src: './node_modules/@resvg/resvg-wasm/index_bg.wasm',
+            dest: './.vercel/output/functions/__nitro.func',
+          },
+        ],
+      }),
+      replace({
+        include: ['./**/*.ts'],
+        '/* WASM_IMPORT */': 'import resvg_wasm from "./index_bg.wasm?module";',
+        delimiters: ['', ''],
+        preventAssignment: false,
+      }),
+    ],
+  },
   esbuild: {
     options: {
-      include: ['**/*.ts', '**/*.tsx', '**/*.js', '**/*.jsx', '**/*.json'],
-      loaders: {
-        '.js': 'js',
-        '.jsx': 'jsx',
-        '.ts': 'ts',
-        '.tsx': 'tsx',
-      }
+      jsxFactory: 'React.createElement',
+      jsxFragment: 'React.Fragment',
     },
   },
-})
+});

docs/package.json

@@ -2,10 +2,10 @@
   "name": "@lucide/docs",
   "version": "1.0.0",
   "description": "",
-  "main": "index.js",
+  "type": "module",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
-    "docs:dev": "pnpm run \"/^prebuild:.*/\" && vitepress dev",
+    "docs:dev": "pnpm prebuild && vitepress dev",
     "docs:build": "vitepress build",
     "docs:preview": "vitepress preview",
     "build:docs": "vitepress build",
@@ -18,20 +18,23 @@
     "dev": "npx nitropack dev",
     "build:api": "npx nitropack build",
     "prebuild": "pnpm prebuild:iconNodes && pnpm prebuild:metaJson && pnpm prebuild:releaseJson && pnpm prebuild:relatedIcons && pnpm prebuild:iconDetails",
-    "build": "pnpm run \"/^prebuild:.*/\" && pnpm build:api && pnpm build:docs && pnpm postbuild:vercelJson",
+    "build": "pnpm prebuild && pnpm build:api && pnpm build:docs && pnpm postbuild:vercelJson",
     "preview": "node .output/server/index.mjs"
   },
   "author": "Eric Fennis",
   "license": "ISC",
   "devDependencies": {
-    "h3": "^1.6.4",
-    "nitropack": "^2.4.1",
+    "@rollup/plugin-replace": "^5.0.2",
+    "h3": "^1.8.0",
+    "nitropack": "npm:nitropack-edge@latest",
     "node-fetch": "2",
-    "vitepress": "1.0.0-beta.1"
+    "rollup-plugin-copy": "^3.4.0",
+    "vitepress": "1.0.0-rc.4"
   },
   "dependencies": {
     "@floating-ui/vue": "^1.0.1",
     "@headlessui/vue": "^1.7.13",
+    "@resvg/resvg-wasm": "^2.4.1",
     "@vueuse/components": "^10.1.0",
     "@vueuse/core": "^10.1.0",
     "element-to-path": "^1.2.1",
@@ -44,7 +47,7 @@
     "lucide-vue-next": "workspace:*",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "semver": "^7.5.0",
+    "semver": "^7.5.2",
     "shiki": "^0.14.2",
     "shiki-processor": "^0.1.3",
     "simple-git": "^3.18.0",

icons/antenna.json

@@ -0,0 +1,31 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "danielbayley"
+  ],
+  "tags": [
+    "signal",
+    "connection",
+    "connectivity",
+    "tv",
+    "television",
+    "broadcast",
+    "live",
+    "frequency",
+    "tune",
+    "scan",
+    "channels",
+    "aerial",
+    "receiver",
+    "transmission",
+    "transducer",
+    "terrestrial",
+    "satellite",
+    "cable"
+  ],
+  "categories": [
+    "devices",
+    "multimedia",
+    "communication"
+  ]
+}

icons/antenna.svg

@@ -0,0 +1,18 @@
+<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 12 7 2" />
+  <path d="m7 12 5-10" />
+  <path d="m12 12 5-10" />
+  <path d="m17 12 5-10" />
+  <path d="M4.5 7h15" />
+  <path d="M12 16v6" />
+</svg>

icons/archive-restore.json

@@ -5,11 +5,12 @@
     "ericfennis"
   ],
   "tags": [
-    "archive",
     "unarchive",
-    "restore",
     "index",
-    "box"
+    "backup",
+    "box",
+    "storage",
+    "records"
   ],
   "categories": [
     "files",

icons/archive-restore.svg

@@ -9,9 +9,9 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <rect width="20" height="5" x="2" y="4" rx="2" />
-  <path d="M12 13v7" />
-  <path d="m9 16 3-3 3 3" />
-  <path d="M4 9v9a2 2 0 0 0 2 2h2" />
-  <path d="M20 9v9a2 2 0 0 1-2 2h-2" />
+  <rect width="20" height="5" x="2" y="3" rx="1" />
+  <path d="M4 8v11a2 2 0 0 0 2 2h2" />
+  <path d="M20 8v11a2 2 0 0 1-2 2h-2" />
+  <path d="m9 15 3-3 3 3" />
+  <path d="M12 12v9" />
 </svg>

icons/archive-x.json

@@ -0,0 +1,18 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "danielbayley"
+  ],
+  "tags": [
+    "index",
+    "backup",
+    "box",
+    "storage",
+    "records",
+    "junk"
+  ],
+  "categories": [
+    "files",
+    "mail"
+  ]
+}

icons/archive-x.svg

@@ -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"
+>
+  <rect width="20" height="5" x="2" y="3" rx="1" />
+  <path d="M4 8v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8" />
+  <path d="m9.5 17 5-5" />
+  <path d="m9.5 12 5 5" />
+</svg>

icons/archive.json

@@ -7,7 +7,10 @@
   ],
   "tags": [
     "index",
-    "box"
+    "backup",
+    "box",
+    "storage",
+    "records"
   ],
   "categories": [
     "files",

icons/archive.svg

@@ -9,7 +9,7 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <rect width="20" height="5" x="2" y="4" rx="2" />
-  <path d="M4 9v9a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9" />
-  <path d="M10 13h4" />
+  <rect width="20" height="5" x="2" y="3" rx="1" />
+  <path d="M4 8v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8" />
+  <path d="M10 12h4" />
 </svg>

icons/arrow-down-0-1.json

@@ -13,5 +13,8 @@
     "text",
     "layout",
     "arrows"
+  ],
+  "aliases": [
+    "arrow-down-01"
   ]
 }

icons/arrow-down-1-0.json

@@ -13,5 +13,8 @@
     "text",
     "layout",
     "arrows"
+  ],
+  "aliases": [
+    "arrow-down-10"
   ]
 }

icons/arrow-down-a-z.json

@@ -13,5 +13,8 @@
     "text",
     "layout",
     "arrows"
+  ],
+  "aliases": [
+    "arrow-down-az"
   ]
 }

icons/arrow-down-z-a.json

@@ -14,5 +14,8 @@
     "text",
     "layout",
     "arrows"
+  ],
+  "aliases": [
+    "arrow-down-za"
   ]
 }

icons/arrow-up-0-1.json

@@ -13,5 +13,8 @@
     "text",
     "layout",
     "arrows"
+  ],
+  "aliases": [
+    "arrow-up-01"
   ]
 }

icons/arrow-up-1-0.json

@@ -13,5 +13,8 @@
     "text",
     "layout",
     "arrows"
+  ],
+  "aliases": [
+    "arrow-up-10"
   ]
 }

icons/arrow-up-a-z.json

@@ -13,5 +13,8 @@
     "text",
     "layout",
     "arrows"
+  ],
+  "aliases": [
+    "arrow-up-az"
   ]
 }

icons/arrow-up-z-a.json

@@ -14,5 +14,8 @@
     "text",
     "layout",
     "arrows"
+  ],
+  "aliases": [
+    "arrow-up-za"
   ]
 }

icons/axis-3d.json

@@ -11,5 +11,8 @@
   ],
   "categories": [
     "design"
+  ],
+  "aliases": [
+    "axis-3-d"
   ]
 }

icons/badge-cent.json

@@ -0,0 +1,32 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "danielbayley"
+  ],
+  "tags": [
+    "discount",
+    "offer",
+    "sale",
+    "voucher",
+    "tag",
+    "monetization",
+    "marketing",
+    "finance",
+    "financial",
+    "exchange",
+    "transaction",
+    "payment",
+    "cents",
+    "dollar",
+    "usd",
+    "$",
+    "¢"
+  ],
+  "categories": [
+    "shopping",
+    "money",
+    "currency",
+    "account",
+    "shapes"
+  ]
+}

icons/badge-cent.svg

@@ -0,0 +1,15 @@
+<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="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z" />
+  <path d="M12 7v10" />
+  <path d="M15.4 10a4 4 0 1 0 0 4" />
+</svg>

icons/badge-dollar-sign.json

@@ -5,15 +5,26 @@
     "jguddas"
   ],
   "tags": [
-    "verified",
-    "unverified",
+    "discount",
+    "offer",
+    "sale",
+    "voucher",
+    "tag",
     "monetization",
-    "marketing"
+    "marketing",
+    "finance",
+    "financial",
+    "exchange",
+    "transaction",
+    "payment",
+    "usd",
+    "$"
   ],
   "categories": [
-    "account",
-    "social",
+    "shopping",
     "money",
+    "currency",
+    "account",
     "shapes"
   ]
 }

icons/badge-euro.json

@@ -0,0 +1,28 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "danielbayley"
+  ],
+  "tags": [
+    "discount",
+    "offer",
+    "sale",
+    "voucher",
+    "tag",
+    "monetization",
+    "marketing",
+    "finance",
+    "financial",
+    "exchange",
+    "transaction",
+    "payment",
+    "€"
+  ],
+  "categories": [
+    "shopping",
+    "money",
+    "currency",
+    "account",
+    "shapes"
+  ]
+}

icons/badge-euro.svg

@@ -0,0 +1,15 @@
+<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="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z" />
+  <path d="M7 12h5" />
+  <path d="M15 9.4a4 4 0 1 0 0 5.2" />
+</svg>

icons/badge-indian-rupee.json

@@ -0,0 +1,29 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "danielbayley"
+  ],
+  "tags": [
+    "discount",
+    "offer",
+    "sale",
+    "voucher",
+    "tag",
+    "monetization",
+    "marketing",
+    "finance",
+    "financial",
+    "exchange",
+    "transaction",
+    "payment",
+    "inr",
+    "₹"
+  ],
+  "categories": [
+    "shopping",
+    "money",
+    "currency",
+    "account",
+    "shapes"
+  ]
+}

icons/badge-indian-rupee.svg

@@ -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="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z" />
+  <path d="M8 8h8" />
+  <path d="M8 12h8" />
+  <path d="m13 17-5-1h1a4 4 0 0 0 0-8" />
+</svg>

icons/badge-japanese-yen.json

@@ -0,0 +1,29 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "danielbayley"
+  ],
+  "tags": [
+    "discount",
+    "offer",
+    "sale",
+    "voucher",
+    "tag",
+    "monetization",
+    "marketing",
+    "finance",
+    "financial",
+    "exchange",
+    "transaction",
+    "payment",
+    "jpy",
+    "¥"
+  ],
+  "categories": [
+    "shopping",
+    "money",
+    "currency",
+    "account",
+    "shapes"
+  ]
+}

icons/badge-japanese-yen.svg

@@ -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="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z" />
+  <path d="m9 8 3 3v7" />
+  <path d="m12 11 3-3" />
+  <path d="M9 12h6" />
+  <path d="M9 16h6" />
+</svg>

icons/badge-percent.json

@@ -8,12 +8,17 @@
     "verified",
     "unverified",
     "sale",
-    "marketing"
+    "discount",
+    "offer",
+    "marketing",
+    "sticker",
+    "price tag"
   ],
   "categories": [
     "account",
     "social",
     "money",
+    "shopping",
     "maths",
     "shapes"
   ]

icons/badge-pound-sterling.json

@@ -0,0 +1,30 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "danielbayley"
+  ],
+  "tags": [
+    "discount",
+    "offer",
+    "sale",
+    "voucher",
+    "tag",
+    "monetization",
+    "marketing",
+    "finance",
+    "financial",
+    "exchange",
+    "transaction",
+    "payment",
+    "british",
+    "gbp",
+    "£"
+  ],
+  "categories": [
+    "shopping",
+    "money",
+    "currency",
+    "account",
+    "shapes"
+  ]
+}

icons/badge-pound-sterling.svg

@@ -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="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z" />
+  <path d="M8 12h4" />
+  <path d="M10 16V9.5a2.5 2.5 0 0 1 5 0" />
+  <path d="M8 16h7" />
+</svg>

icons/badge-russian-ruble.json

@@ -0,0 +1,29 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "danielbayley"
+  ],
+  "tags": [
+    "discount",
+    "offer",
+    "sale",
+    "voucher",
+    "tag",
+    "monetization",
+    "marketing",
+    "finance",
+    "financial",
+    "exchange",
+    "transaction",
+    "payment",
+    "rub",
+    "₽"
+  ],
+  "categories": [
+    "shopping",
+    "money",
+    "currency",
+    "account",
+    "shapes"
+  ]
+}

icons/badge-russian-ruble.svg

@@ -0,0 +1,15 @@
+<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="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z" />
+  <path d="M9 16h5" />
+  <path d="M9 12h5a2 2 0 1 0 0-4h-3v9" />
+</svg>

icons/badge-swiss-franc.json

@@ -0,0 +1,29 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "danielbayley"
+  ],
+  "tags": [
+    "discount",
+    "offer",
+    "sale",
+    "voucher",
+    "tag",
+    "monetization",
+    "marketing",
+    "finance",
+    "financial",
+    "exchange",
+    "transaction",
+    "payment",
+    "chf",
+    "₣"
+  ],
+  "categories": [
+    "shopping",
+    "money",
+    "currency",
+    "account",
+    "shapes"
+  ]
+}

icons/badge-swiss-franc.svg

@@ -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="M3.85 8.62a4 4 0 0 1 4.78-4.77 4 4 0 0 1 6.74 0 4 4 0 0 1 4.78 4.78 4 4 0 0 1 0 6.74 4 4 0 0 1-4.77 4.78 4 4 0 0 1-6.75 0 4 4 0 0 1-4.78-4.77 4 4 0 0 1 0-6.76Z" />
+  <path d="M11 17V8h4" />
+  <path d="M11 12h3" />
+  <path d="M9 16h4" />
+</svg>

icons/bird.json

@@ -8,7 +8,8 @@
     "peace",
     "freedom",
     "wing",
-    "avian"
+    "avian",
+    "tweet"
   ],
   "categories": [
     "animals"

icons/blocks.json

@@ -0,0 +1,23 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "danielbayley"
+  ],
+  "tags": [
+    "addon",
+    "plugin",
+    "integration",
+    "extension",
+    "package",
+    "build",
+    "stack",
+    "toys",
+    "kids",
+    "children",
+    "learning"
+  ],
+  "categories": [
+    "development",
+    "shapes"
+  ]
+}

icons/blocks.svg

@@ -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"
+>
+  <rect width="7" height="7" x="14" y="3" rx="1" />
+  <path d="M10 21V8a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-5a1 1 0 0 0-1-1H3" />
+</svg>

icons/bone.json

@@ -5,14 +5,16 @@
     "jguddas"
   ],
   "tags": [
-    "medical",
     "health",
+    "skeleton",
+    "skull",
     "death",
-    "pet",
-    "gaming"
+    "pets",
+    "dog"
   ],
   "categories": [
+    "animals",
     "medical",
-    "animals"
+    "gaming"
   ]
 }

icons/boom-box.json

@@ -0,0 +1,18 @@
+{
+  "$schema": "../icon.schema.json",
+  "tags": [
+    "radio",
+    "speakers",
+    "audio",
+    "music",
+    "sound",
+    "broadcast",
+    "live",
+    "frequency"
+  ],
+  "categories": [
+    "devices",
+    "multimedia",
+    "social"
+  ]
+}

icons/boom-box.svg

@@ -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"
+>
+  <path d="M4 9V5a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v4" />
+  <path d="M8 8v1" />
+  <path d="M12 8v1" />
+  <path d="M16 8v1" />
+  <rect width="20" height="12" x="2" y="9" rx="2" />
+  <circle cx="8" cy="15" r="2" />
+  <circle cx="16" cy="15" r="2" />
+</svg>

icons/bot.json

@@ -1,14 +1,16 @@
 {
   "$schema": "../icon.schema.json",
   "contributors": [
-    "mittalyashu",
     "ericfennis"
   ],
   "tags": [
     "robot",
-    "ai"
+    "ai",
+    "chat",
+    "assistant"
   ],
   "categories": [
-    "development"
+    "development",
+    "social"
   ]
-}
+}

icons/bot.svg

@@ -9,9 +9,10 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <rect width="18" height="10" x="3" y="11" rx="2" />
-  <circle cx="12" cy="5" r="2" />
-  <path d="M12 7v4" />
-  <line x1="8" x2="8" y1="16" y2="16" />
-  <line x1="16" x2="16" y1="16" y2="16" />
+  <path d="M12 8V4H8" />
+  <rect width="16" height="12" x="4" y="8" rx="2" />
+  <path d="M2 14h2" />
+  <path d="M20 14h2" />
+  <path d="M15 13v2" />
+  <path d="M9 13v2" />
 </svg>

icons/box.svg

@@ -9,7 +9,7 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z" />
-  <polyline points="3.29 7 12 12 20.71 7" />
-  <line x1="12" x2="12" y1="22" y2="12" />
+  <path d="M21 8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16Z" />
+  <path d="m3.3 7 8.7 5 8.7-5" />
+  <path d="M12 22V12" />
 </svg>

icons/brain-cog.svg

@@ -9,12 +9,14 @@
   stroke-linecap="round"
   stroke-linejoin="round"
 >
-  <path d="M12 4.5a2.5 2.5 0 0 0-4.96-.46 2.5 2.5 0 0 0-1.98 3 2.5 2.5 0 0 0-1.32 4.24 3 3 0 0 0 .34 5.58 2.5 2.5 0 0 0 2.96 3.08A2.5 2.5 0 0 0 9.5 22c1.21 0 2.5-.74 2.5-2.5m0-15a2.5 2.5 0 0 1 4.96-.46 2.5 2.5 0 0 1 1.98 3 2.5 2.5 0 0 1 1.32 4.24 3 3 0 0 1-.34 5.58 2.5 2.5 0 0 1-2.96 3.08A2.5 2.5 0 0 1 14.5 22c-1.21 0-2.5-.74-2.5-2.5m0-15V5m0 14.5V19" />
-  <circle cx="12" cy="12" r="2" />
-  <path d="M12 9v1" />
-  <path d="M12 14v1" />
-  <path d="m14.6 10.5-.87.5" />
-  <path d="m10.27 13-.87.5" />
-  <path d="m14.6 13.5-.87-.5" />
-  <path d="m10.27 11-.87-.5" />
+  <circle cx="12" cy="12" r="3" />
+  <path d="M12 4.5a2.5 2.5 0 0 0-4.96-.46 2.5 2.5 0 0 0-1.98 3 2.5 2.5 0 0 0-1.32 4.24 3 3 0 0 0 .34 5.58 2.5 2.5 0 0 0 2.96 3.08A2.5 2.5 0 0 0 12 19.5a2.5 2.5 0 0 0 4.96.44 2.5 2.5 0 0 0 2.96-3.08 3 3 0 0 0 .34-5.58 2.5 2.5 0 0 0-1.32-4.24 2.5 2.5 0 0 0-1.98-3A2.5 2.5 0 0 0 12 4.5" />
+  <path d="m15.7 10.4-.9.4" />
+  <path d="m9.2 13.2-.9.4" />
+  <path d="m13.6 15.7-.4-.9" />
+  <path d="m10.8 9.2-.4-.9" />
+  <path d="m15.7 13.5-.9-.4" />
+  <path d="m9.2 10.9-.9-.4" />
+  <path d="m10.5 15.7.4-.9" />
+  <path d="m13.1 9.2.4-.9" />
 </svg>

icons/bring-to-front.json

@@ -0,0 +1,22 @@
+{
+  "$schema": "../icon.schema.json",
+  "contributors": [
+    "james-yeoman",
+    "jguddas"
+  ],
+  "tags": [
+    "bring",
+    "send",
+    "move",
+    "over",
+    "forward",
+    "front",
+    "overlap",
+    "layer",
+    "order"
+  ],
+  "categories": [
+    "design",
+    "layout"
+  ]
+}