react-native-feather-icon

React Native Feather Icon

A lightweight and customizable React Native component for Feather icons. This package provides an easy-to-use wrapper around react-native-feather with TypeScript support.

Works well on Expo and React Native CLI.

Installation

First, install the package:

npm install react-native-feather-icon
# or
yarn add react-native-feather-icon

This package requires react-native-feather as a peer dependency. If you haven't installed it yet:

npm install react-native-feather
# or
yarn add react-native-feather

Examples

Usage

import FeatherIcon from 'react-native-feather-icon';

// Basic usage
<FeatherIcon iconName="Heart" />

// Customized icon
<FeatherIcon
  iconName="User"
  color="#FF0000"
  width={24}
  height={24}
  strokeWidth={2}
/>

// With style prop
<FeatherIcon
  iconName="ArrowRight"
  style={{ marginRight: 10 }}
/>

Props

Prop	Type	Default	Description
iconName	string	'Circle'	Name of the Feather icon to display
color	string	'#7D7D7D'	Color of the icon
width	number	15	Width of the icon
height	number	15	Height of the icon
strokeWidth	number	2	Stroke width of the icon
style	StyleProp<ViewStyle>	-	Additional styles for the icon container

Icons List

All Feather icons are available in this package. You can browse the complete list at: Feather Icons: https://feathericons.com

Important: Icon names should be in PascalCase format. Examples:

• arrow-right → 'ArrowRight'
• user-plus → 'UserPlus'
• log-out → 'LogOut'

• 

Features

• 🎨 Fully customizable (color, size, stroke width)
• 📱 TypeScript support
• 🪶 Access to all Feather icons
• ⚡️ Lightweight
• 🔄 Fallback to Circle icon if invalid icon name is provided

Requirements

• React Native >= 0.64.0
• React >= 17.0.0
• react-native-feather >= 1.1.2

License

MIT

Author

Hilal Oruç

Contributing

Contributions, issues, and feature requests are welcome!

Support

If you like this project, please give it a ⭐️ on GitHub!