Eric FennisandKarsa 5bfc736b61 New site! 🚀 (#1275)
* add new docs

* Add styling

* Move files

* Add active selection

* improve grid overview

* improve grid

* Add icon detail page

* Minor changes

* Fix icon preview

* optimize home card

* Add code examples

* Add gitignore

* correct temp directory

* Add first cusotmizer

* Add customizer

* fix images paths

* Add reset function

* Adjust category rendering

* Add packages section

* Some fixes

* Fix vercel build icon

* Small code adjustment

* move file

* Try this

* Add code groups with syntax highlighting

* Add search icon

* Cleanup

* update lockfile

* turnoff 404

* remove docs/iconMetaData.ts

* fix build

* Fix build 2

* cleanup

* Add icon customizer

* Fix build

* Add steps

* Add Button menu

* A lot off fixes!

* cleanup

* Fix build

* Css fixes

* Override menu icon

* try this to improve preformance

* minor improvements

* add comment

* add readme

* Add title

* minor fixes

* Fixes sliders + removes random backticks from index

* Added package list base, still WIP

* Added Guide+Source buttons to package list items

* Responsive support for XS screens

* Map categories count

* Adjust tooltip hover position

* Add see in action icon

* Add download options

* Aligns category list items to baseline and decreases category count weight

* Fixes event target error for categorylistitems

* Added icon release metadata builder

* Adds version badges to hero + icon detail overlay

* Added contributors.
Added Copy Angular.
Added release info to icon page.

* Centres contributor tooltip

* Fixed stroke step + added reset button

* Extracted reset button as a separate component for reusability

* Makes HomeIconCustomizerIcons less dense

* Fixes Button menu

* adjust versions and contributors styling on detail page

* Fix build?

* Fix build 2?

* Fix build 3

* Fix build 4

* Fix build 5?

* Add latest gh-icon changes

* Add comment

* Try fetch tags to retrieve release data

* try fetch all tags

* Add related icons

* Add stikcy search bar

* Add no results components

* Try to fix animation

* Try optimizing for categories

* Hide buggy animated icon

* minor fixes

* Add footer

* Add contributute link in footer

* Add copy name

* Add 100% preview icons

* remove site directory

* clean up

* Add redirects

* Fix build?

* fix redirect?

* minor improvements

* Fix icons preview on mobile

* Small preformance improvement

* Dark mode fixes for package icons

* Sort related icons by similarity + somewhat better name similarity matching

* Replace icon design guide images with uniform SVGs

* update lockfile

* Adds git clone to manually fetch the main repository for creating release metadata

* Remove initial v0.0.0 from release metadata

* Add extra CTA to no results behaviour

* Remove tags, as they are too overused

* Revert "Remove tags, as they are too overused"

This reverts commit 909b7563c0.

* Checkout icons from main

* Add absoluteStrokeWidth switch

* Add absolute strokewidth to home customizer

* Add absolute strokewidth to copy code button

* remove unused import

* compare build time

* improve build speed

* Try new release meta data script

* add fetch tags

* try with branch and remote

* try with url

* try without ssh

* Fix fetch tags in build file

* Cleanup

* Fix fallback

* improve release data

* delete relatedIcons.json, because it should be gitignored

* Add icon details

* Fix import

* minor fixes

* Try running script parallel

* Revert icon details

* include aliases in  release meta data

* Final fixes

* Final fixes 2

* minor code adjustment

* Fix build

* test

* Revert concurrent build flow

* switch back to concurrent build strategy

* revert icon changes

* update package.json

* update package.json

* dedube packages

---------

Co-authored-by: Karsa <karsa@karsa.org>
2023-06-04 16:59:38 +02:00
2023-04-09 16:49:11 +02:00
2023-06-04 16:59:38 +02:00
2023-06-04 16:59:38 +02:00
2023-06-04 16:59:38 +02:00
2023-06-04 16:59:38 +02:00
2023-06-04 16:59:38 +02:00
2021-02-22 20:26:38 +01:00
2022-08-10 09:10:53 +02:00
2020-07-01 17:28:35 +01:00
2023-06-04 16:59:38 +02:00
2022-07-20 21:16:43 +02:00
2023-06-04 16:59:38 +02:00
2023-06-04 16:59:38 +02:00
2023-06-04 16:59:38 +02:00
2023-01-10 21:05:27 +01:00

Lucide Logo

license npm package figma installs build status discord chat

Lucide

Community-run fork of Feather Icons, open for anyone to contribute icons.

It began after growing disaffection with the Feather Icons project moderation. With over 300+ open issues and over 100+ open PRs, the Feather Icons project has been abandoned. This unfortunately means that hundreds of developers and designers wasted their time contributing to Feather Icons with no chance of PRs being accepted.

Lucide is trying to expand the icon set as much as possible while staying faithful to the original simplistic design language. We do this as a community of devs and designers and hope that you'll join us!

Why choose Lucide over Feather Icons

  • More icons to work with: Lucide already has hundreds of icons more than Feather does.
  • Official librairies and integrations with popular frameworks and design tools.
  • Well maintained code base.
  • Active community, regularly growing and improving the set.

Table of Contents

Usage

At its core, Lucide is a collection of SVG files. This means that you can use Lucide icons in all the same ways you can use SVGs (e.g. img, background-image, inline, object, embed, iframe). Here's a helpful article detailing the many ways SVGs can be used on the web: SVG on the Web – Implementation Options

The following are additional ways you can use Lucide. With the Javascript library you can easily incorporate the icon you want in your webpage.

Web

Implementation of the lucide icon library for web applications.

npm install lucide

or

yarn add lucide

For more details, see the documentation.

React

Implementation of the lucide icon library for react applications.

yarn add lucide-react

or

npm install lucide-react

For more details, see the documentation.

React Native

Implementation of the lucide icon library for React Native applications.

yarn add lucide-react-native

or

npm install lucide-react-native

For more details, see the documentation.

Vue 2

Implementation of the lucide icon library for vue applications.

yarn add lucide-vue

or

npm install lucide-vue

For more details, see the documentation.

Vue 3

Implementation of the lucide icon library for vue applications.

yarn add lucide-vue-next

or

npm install lucide-vue-next

For more details, see the documentation.

Angular

yarn add lucide-angular

or

npm install lucide-angular

For more details, see the documentation.

Preact

Implementation of the lucide icon library for preact applications.

yarn add lucide-preact

or

npm install lucide-preact

For more details, see the documentation.

Static (svg sprite, font, icons ..)

Assets: Font Files SVG Files SVG Sprite

NPM package

yarn add lucide-static

or

npm install lucide-static

Figma

The lucide figma plugin.

Visit Figma community page to install the plugin.

Figma Lucide Cover

Laravel

Implementation of Lucide icon's using blade-icons for Laravel based projects.

composer require mallardduck/blade-lucide-icons

For more details, see the documentation.

Flutter

Implementation of Lucide icon library for Flutter applications.

flutter pub add lucide_icons

For more details, see the pub.dev.

Svelte

Implementation of the lucide icon library for Svelte applications.

yarn add lucide-svelte

or

npm install lucide-svelte

For more details, see the documentation.

Solid

Implementation of the lucide icon library for solid applications.

yarn add lucide-solid

or

npm install lucide-solid

For more details, see the documentation.

Hyva

Implementation of Lucide icon's using Hyvä's svg php viewmodal to render icons for Magento 2 Hyva theme based projects.

composer require siteation/magento2-hyva-icons-lucide

For more details, see the documentation.

Eleventy

Using this plugin, Eleventy projects can incorporate Lucide icons. it makes it simple to use Lucide icons into your themes via shortcodes, improving your website's overall usability and visual appeal.

npm install @grimlink/eleventy-plugin-lucide-icons

For more details, see the documentation.

Contributing

For more info on how to contribute please see the contribution guidelines.

Caught a mistake or want to contribute to the documentation? Edit this page on Github

Community

Join the community on our Discord server!

License

Lucide is totally free for commercial use and personally use, this software is licensed under the ISC License.

Credits

Thank you to all the people who contributed to Lucide!

Sponsors

Powered by Vercel
Languages
TypeScript 88.6%
JavaScript 9.5%
Svelte 0.8%
Vue 0.5%
HTML 0.4%
Other 0.2%