Feather Icons Icons

Browse 286 free Feather Icons SVG icons. Download SVG, copy as JSX, PNG or Base64. MIT licensed. Designed by Cole Bemis. Styles: Precise Shapes, Has Padding, Uses Stroke.

286 icons MIT 24px grid by Cole Bemis
+F

Copy & download Feather Icons icons

Click any icon above to open the detail panel. Four export formats are available instantly — no sign-up required.

SVG

Raw vector markup. Paste directly into HTML or React components. Scales to any size without quality loss.

JSX / TSX

React-ready component. Drop into any React or Next.js project. Works with shadcn/ui, Radix, and Tailwind CSS.

PNG

Raster export at 1×, 2× and 3× for email templates, Figma imports, app assets, and Open Graph images.

Base64

Inline data URI — embed icons in CSS background-image, email HTML, or anywhere an image URL is needed.

Works with shadcn/ui

Copy the JSX format and paste directly into any shadcn/ui component. Alternatively, install feather-icons and use via @iconify/react — fully tree-shakeable, no icon font loading required.

About Feather Icons

Feather is a collection of 286 minimalist open-source SVG icons, each drawn on a 24px grid with a consistent 2px stroke and rounded line caps. Though Feather's active development has stopped, its design language established the "modern minimal outline" aesthetic that directly influenced Lucide, Akar Icons, and dozens of other icon libraries. MIT licensed and free for all uses. For new projects, Lucide Icons is the recommended successor — a community-maintained fork with 1,500+ icons, active development, and fully compatible naming conventions (most icon names are identical). Feather is still valid when you need a very small, stable, zero-maintenance icon set, or when preserving existing Feather-based projects. Search all Feather SVG icons here, copy SVG code, export as React JSX or Base64, and download as PNG. Feather's restraint pairs particularly well with monochrome interfaces, technical documentation sites, and developer tools where visual simplicity is a deliberate design choice.

Created By

Cole Bemis Visit Website

License

Features & Tags

Precise Shapes Has Padding Uses Stroke

How to use Feather Icons icons

Package

feather-icons

License SPDX

MIT

Grid Size

24px

Sample Icons

check-circle, award, home

Install

bash
npm install feather-icons

React

tsx
// For new projects, prefer Lucide (drop-in replacement):
// npm install lucide-react
import { Search } from 'lucide-react';

// Or use Feather directly via Iconify:
import { Icon } from '@iconify/react';
export default function App() {
  return <Icon icon="feather:search" width={24} />;
}

HTML / CDN

html
<!-- Feather CDN -->
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
<i data-feather="search"></i>
<script>feather.replace();</script>

Via Iconify · any framework

tsx
import { Icon } from '@iconify/react';

export default function App() {
  return <Icon icon="feather:icon-name" width={24} />;
}

Package stats

Build-time npm metadata cached weekly • Last refresh May 12, 2026

feather-icons

Simply beautiful open source icons

v4.29.2
Score 68%
Popularity 46%
Quality 96%
Maintenance 66%

License

MIT

Weekly downloads

168K

Monthly downloads

676.6K

Total downloads

9.6M

Unpacked size

611 KB

Last published

May 1, 2024

Registry updated

May 1, 2024

Compare Feather Icons with similar icon packs

Frequently Asked Questions

Feather is no longer actively developed. Lucide Icons is the community-maintained fork with 5× more icons and identical design principles — recommended for new projects.

For new projects, use Lucide. It is API-compatible with Feather, MIT licensed, actively maintained, and has 1,500+ icons vs Feather's 286.

Feather has official packages for vanilla JS, React, Vue, and Angular. Since Lucide is a drop-in replacement, migrating requires only a package name swap.