With Lucide Lab or custom icons

Lucide Lab is a collection of icons that are not part of the Lucide main library.

They can be used by adding the @lucide/lab package to your project. All props like regular lucide icons can be passed to adjust the icon appearance.

Using Lucide Lab icons

This creates a single icon based on the iconNode passed and renders a Lucide icon component.

<!DOCTYPE html>
<html>
  <body>
    <i data-lucide="avocado"></i>

    <script src="index.js"></script>
  </body>
</html>

Open Sandbox

With Lucide Lab or custom icons ​

Using Lucide Lab icons ​

With Lucide Lab or custom icons

Using Lucide Lab icons