Nobody Publish Monsters

    lucide-react
    TypeScript icon, indicating that this package has built-in type declarations

    0.90.0 • Public • Published

    Lucide React

    Implementation of the lucide icon library for react applications.

    What is lucide? Read it here.

    Installation

    yarn add lucide-react
    
    # or
    
    npm install lucide-react

    How to use

    It's built with ES modules so it's completely threeshakable. Each icon can be imported as a react component.

    Example

    You can pass additional props to adjust the icon.

    import { Camera } from 'lucide-react';
    
    const App = () => {
      return <Camera color="red" size={48}/>
    };
    
    export default App;

    Props

    name type default
    size Number 24
    color String currentColor
    strokeWidth Number 2

    Custom props

    You can also pass custom props that will be added in the svg as attributes.

    const App = () => {
      return <Camera fill="red"/>
    };

    Generic icon component

    It is possible to create a generic icon component to load icons.

    ⚠️ The example below is importing all ES modules. This is not recommended when you using a bundler since your application build size will grow substantially.

    import * as icons from 'lucide-react';
    
    const Icon = ({name, color, size}) => {
      const LucideIcon = icons[name];
    
      return <LucideIcon color={color} size={size} />
    };
    
    export default Icon;

    Keywords

    none

    Install

    npm i lucide-react

    Homepage

    lucide.dev

    DownloadsWeekly Downloads

    10,948

    Version

    0.90.0

    License

    ISC

    Unpacked Size

    6.64 MB

    Total Files

    848

    Last publish

    Collaborators

    • ericfennis