Lucide 1.0 - Defining Scope and Features

[ericfennis]

Defining Lucide 1.0

Summary

Lucide is almost reaching the 300 in the minor version number and it’s good to start thinking about version 1.0 and start working to this goal.

Looking at some issues we have open on Github we can define 1.0. If combine the relevant issues in one list we can split it up into 3 sections: “icons”, “Community” and “packages”.

Subjects & issues

Icons

• Complete the list of icons of feather icons issues #119
• Fix icon size designs #1192
• Fix guideline violations
  • Remove Brand Icons #94
  • Rename icons that end with -2, etc.
  • Rename icons that do have not a generic name.
  • Make a list of icons that we are not happy with.
• Flatting SVG paths?
  • Only for shipped packages
  • This makes using opacity better
  • Needs research on how to deal with path shapes like “circle, rect, etc.”
• Remove brand icons Remove brand icons? #94
  • Will be executed on v1
  • Add warning for all packages.

Community

• New website New lucide.dev homepage design request #649
  • Icon Categories on website #669
• Improve documentation
  • Basics documentation section Add Lucide basics guide on site #1521
  • Migration guide Feather → Lucide
  • Advanced documentation section
    • Accessibility
    • Global styling
    • Animations
    • Filled icons
    • Combining icons
    • Dynamic imports
    • Auto importing
  • Figma plugin showcase
• Add a Contributors License Agreement
• Conventions for naming icons Write conventions for naming icons #112
• Second library for superfluous icons
  • Some proposed icons are nicely designed but have unknown usecase.
  • Discussions in Make it easy to fork and release a modified version of lucide. #1607

Packages

• Add aliases support
• API of lucide-angularmust be the same as other lucide packages
• Fix the font building
• Make packages stable as possible
  • Solve Svelte slow import issue #1284
  • Svelte: Module not found Svelte: Module not found: Error: Default condition should be last one #1572
  • Slow dynamic imports NextJS Dynamic Import makes NextJS development server very slow #1576
• Publishing package under @lucide/{packageName}
  • lucide-vue-next → @lucide/vue
    • no vue 2 support (will be EOF end of this year)
• Create release workflow #1550
  • Choose a better way to release semantic
• absoluteStrokeWidth ⇒ vector-effect: non-scaling-stroke
• Dynamic imports support for all packages
  • React package
  • Vue package
  • Svelte Package
  • Solid Package
  • Preact Package
  • Angular package?

Motivation

Icons

We have added so many new icons in the past year. We now have more than 1300 icons, that’s the crazy number if you compare it with where we started with 287 icons. Thank you to all contributors who contributed all those icons, We should continue with adding more.

But for 1.0 we can’t determine which icons we should have included in our library, it will always be an ongoing process. However, we started issue #119 almost from the beginning. It would be a nice achievement if we could say we have added all requested icons from the feather project. We have still 15 icons to go!

If we look at the whole library, we still have some icons that are not well-named. Some are not generic and some are a bit weirdly named. Also, we want to stop naming icons with a -2 suffix. Brand icons will be removed on v1.0.

We want to make it easier to work with Lucide icons by exploring the idea of flattening SVGs. This will make it easier to use alpha color values with Lucide icons like rgba, hsla etc. Currently, it's making overlapping icons visible. This also can make the library a bit smaller and more performant, since machines only need to draw an SVG path one time.

Community

Some call it our marketing website, our “front of site”. But it’s more of that. It’s a tool to find your icons, a tool to adjust icons, and it’s a book of documentation on how to use our libraries.

The last year we improved it a lot. With the launch of the new website, we have created something we can continue for the next years. And we are happy that we switched to Vitepress which is updated frequently.

But we are not done yet, we still need to improve our documentation. We have already written a “basics” section, which helps to get started. But we also want to write more “in-depth” articles about using Lucide icons. Some topic ideas: “Accessibility”, “Global styling”, “Animations”.

We should highlight the Figma plugin more. The Lucide Figma plugin is a great addition to the Lucide ecosystem. It also meets new designers to contribute to Lucide.

We also have ideas about a second icon library containing icons without known use cases. Before we merge new icons in the library, we require icons to have a valid use case. Otherwise, we will end up with icons people will never use. But unfortunately, we reject icon proposals now and then, some icon designs are beautifully made. So we want to explore the idea of a second library that contains these “rejected” icons. We will research the use of these icons and consider adding them to the main library.

Packages

We want to make all packages as stable as possible, but we still have some issues with certain frameworks. We need to solve these issues before going to v1.

For the React package, we added some experimental features like dynamicImports and JS Docs. These features are well adopted and should be added to all other packages as well.

Packages should be released under the @Lucide organization. This will make it more clear that packages are official Lucide packages, and we don’t have any name conflicts when we want to publish new packages.

But it requires devs to change the package name. Not sure if NPM has something to migrate from lucide-react to @lucide/react for example. But we should make this change on Lucide 1.0

Feedback

We encourage the community to provide feedback on this RFC. Your input is valuable and will help us shape the direction of Lucide 1.0. Please feel free to share your thoughts, suggestions, concerns, or any other feedback you may have.

To provide feedback, you can:

• Leave a comment on this GitHub issue
• Join our community Discord server and participate in the #lucide-v1 channel
• Reach out to the Lucide team directly via email at team@lucide.dev

We appreciate your involvement and look forward to hearing from you!

Participate

We welcome and encourage everyone to participate in the development and improvement of Lucide 1.0. Your contributions, feedback, and ideas are vital to shaping the future of Lucide.

Feel free to help on those open issues we linked in the “Subjects & issues” section. For new features, make sure you post a comment on the issue and share your ideas before you start working on it.

We will label issues with Version 1 to easily filter on these.

Thank you to all the people who already contributed to Lucide. Let's create an amazing icon library for developers worldwide!

[zaaakher]

Wonderful 👍

Here are a few suggestions that just came to mind:

Lucide History

Something like lucide-history or lucide-archive

Putting all the removed icons (throughout lucide history) into a separate package/repo

• This will simulate a "backward-compatibility" experience for developers using old deprecated/removed icons
• it will also comfort any designer who previously contributed new icons to Lucide and doesn't want to see their work disappear into the abyss and instead they can still use it via that package.
• it could streamline the process of bringing back a removed icon just in case minds changed about a certain icon.

It's true that I can just install an older version of lucide to access a removed icon, but that would have two problems:

• I wouldn't know which version the removed icon was last published in (I would have to do some deep digging since the old
  removed icons won't be in the website)
• I can't use the latest version (let's say v1.0) to access new fresh icons, while also using an older version to access that one or two removed icon I need.

Lucide AI

an AI that generates new lucide icons

Since the design guidelines/standards are clear and concise, we can perhaps feed it to an AI that would assist generating new icons based on a prompt.

• This would make it easier for non-designers and people with no vector graphics editor program to easily suggest icons with an actual SVG starting point to help the maintainers.
• Depending on how good the result of the ai is, the maintainers may do some additional touch-up or just approve and merge without having to touch the svg (if the AI result was perfect)
• Having this human-ai interaction might help refine the design guidelines & standards based on mistakes and misinterpretations of the AI generator.

NPM Package names

Getting the @lucide npm handle

It would be great if the npm packages were named like:
@lucide/core
@lucide/react
@lucide/vue
... etc

As I'm writing this, I noticed that @lucide npm handle is taken by an empty unused organization. In this case I suggest the maintainers to file an npm name dispute form. Although it's not garuanteed npm would release that handle to us, but inshallah they will, since this is growing and beautiful open-source project that's well-maintained ✨

Another teeny tiny suggestion is to remove "a fork of Feather Icons" from this project bio since it's already mentioned in the README. (and we have about a thousand more icons than feather-icons). But that's just my opinion, 😁

[karsa-mistmere]

@zaaakher:

lucide-history

To be truly backwards compatible this would pretty much have to be an extra package per framework, which is a burden we're not really willing to take.
Other than this technical issue, icons queued for removal are brand icons only and this is due to copyright and brand guideline violations, so still keeping these icons around in any official format would not resolve this issue.
As Eric has mentioned, we're looking into building a new Lucide ecosystem where third party icons can be more fluidly added; people wishing to knowingly violate brand icon guidelines or copyrights will be able to piggyback this system, but we will no longer support these icons under the Lucide flag in any way.

Lucide AI

Fun idea, but I'd put this in the v1.1 or even v2 milestone idea box (or we'll never manage to finally release v1). 😄

The @lucide npm namespace

This is part of our v1 RFC, it's in Eric's checklist under Packages. To my best knowledge, the handle was also reserved by him. 🙂

[zaaakher]

it's in Eric's checklist under Packages

Oops I totally missed that, I came in guns blazin' with thoughts I didn't even read the full text 😅

To be truly backwards compatible this would pretty much have to be an extra package per framework, which is a burden we're not really willing to take.

Oh ok in that case it's definitely not worth it since it's mostly for very rare edge cases.

Fun idea, but I'd put this in the v1.1 or even v2 milestone idea box (or we'll never manage to finally release v1). 😄

Agree, I don't think it should be anchored to any version, just an experimental path to explore until its mature enough to be released.

I'm excited about the future of this project and looking forward to collaborating with you all when possible. 👍🌹

[josephclaytonhansen]

Should lucide labs be added to this list? Also, a web icon viewer for labs would be awesome 👀