feather.md

description	Modern alternatives to feather packages

Replacements for feather-icons and react-feather

lucide for feather-icons

lucide is a community-maintained fork of Feather Icons.

Example:

import feather from 'feather-icons' // [!code --]
import { icons } from 'lucide' // [!code ++]

feather.icons.x.toSvg({ class: 'icon icon-x' }) // [!code --]
icons.x.toSvg({ class: 'icon icon-x' }) // [!code ++]

lucide-react for react-feather

lucide-react provides React components for the Lucide icon set and is the natural replacement for react-feather.

Example:

import { Camera, ArrowRight } from 'react-feather' // [!code --]
import { Camera, ArrowRight } from 'lucide-react' // [!code ++]

export function Header() {
  return (
    <>
      <Camera size={18} />
      <ArrowRight className="cta-icon" />
    </>
  )
}

Note

Lucide provides information on the comparison of it vs feather-icons