Feather Icons
Feather Icons is the original minimal open-source icon library that inspired a generation of modern icon sets. Created by Cole Bemis, Feather established the design language of clean, consistent stroke-based icons that libraries like Lucide later built upon. With 287 carefully crafted icons, Feather prioritizes quality and consistency over quantity. Every icon is designed on a 24x24 grid with a 2px stroke, rounded line caps, and rounded line joins — creating a cohesive, friendly aesthetic that works well for consumer-facing applications. The collection is licensed under MIT; review the icon license guide for commercial-use details.
Feather Icons Specifications & Framework Compatibility
| Property | Specification Details |
|---|---|
| Total Icons | 573 vector SVG icons |
| License | MIT (Commercial & Personal Use) |
| TypeScript Support | Native .d.ts definitions included |
| Framework Support | React, Next.js, Vue, Svelte, Tailwind CSS |
| Primary NPM Package | react-feather |
| Source Repository | Official GitHub Repository → |
How many icons does Feather Icons have?
Feather Icons currently includes 573 vector icons indexed in the IconSearch catalog. Every icon is available in clean SVG format with customizable stroke widths, colors, and direct multi-framework code exports for modern web applications.
Is Feather Icons free for commercial use?
Yes, Feather Icons is distributed under the MIT license. This permissive open-source license allows unrestricted commercial and personal usage in proprietary software, SaaS platforms, client websites, and digital products without licensing fees.
How do you install and use Feather Icons in React, Next.js, and Vue?
Install the package using npm install react-feather, then import icons directly into your JSX, TSX, or Vue components. Alternatively, copy raw customized SVG markup directly from IconSearch with zero client-side JavaScript overhead.
// Install package
npm install react-feather
// React & Next.js App Router usage
import { Activity } from 'react-feather'
export default function Header() {
return <Activity className="w-5 h-5 text-indigo-500" />
}Feather Icons FAQ & Technical Guide
Is Feather Icons still maintained?
No. Feather Icons has not received significant updates since 2020. The maintainer considers it feature-complete. For a maintained alternative with the same design philosophy, use Lucide Icons which is a direct fork of Feather with active development.
What is the difference between Feather Icons and Lucide Icons?
Lucide Icons was forked from Feather Icons in 2020 specifically because Feather stopped being maintained. Lucide has grown to 1,400+ icons vs Feather's 287, has active maintenance, full TypeScript support, and a thriving community.
Is Feather Icons free for commercial use?
Yes. Feather Icons uses the MIT license which allows free use in any commercial project.
How do I migrate from Feather Icons to Lucide Icons?
Most Feather icons have direct equivalents in Lucide with the same names. Uninstall react-feather, install lucide-react, and update your imports. The API is nearly identical — both accept size, color, and strokeWidth props.
Can I use Feather Icons with Next.js?
Yes, react-feather works with Next.js. However given the library is unmaintained, consider using Lucide Icons instead for new Next.js projects.