Skip to content

Commit e9fbefa

Browse files
some additional informations added
1 parent a07a285 commit e9fbefa

1 file changed

Lines changed: 14 additions & 4 deletions

File tree

README.md

Lines changed: 14 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,27 +7,37 @@
77

88
react-native-feather is a collection of simply beautiful open source icons for React Native. Each icon is designed on a 24x24 grid with an emphasis on simplicity, consistency and readability.
99

10+
At its core, Feather is a collection of SVG files. To use SVG files on React Native, [`react-native-svg`](https://github.com/react-native-community/react-native-svg) is needed. This component contains all Feather icons converted to make compatible with [`react-native-svg`](https://github.com/react-native-community/react-native-svg) package.
11+
1012
#### Based on Feather Icons `v4.28.0`
1113

1214
## Installation
1315

1416
1. Ensure sure you've installed [`react-native-svg`](https://github.com/react-native-community/react-native-svg)
1517
2. `npm i react-native-feather`
1618

19+
### Icons
20+
21+
List of available icons in this component.
22+
[https://feathericons.com](https://feathericons.com/)
23+
1724
### Usage
1825

26+
To use icons as component, all icon names is formatted to Pascal Case.
27+
arrow-up-circle => `<ArrowUpCircle/>`
28+
1929
```javascript
20-
import { Activity } from "react-native-feather";
30+
import { ArrowUpCircle } from "react-native-feather";
2131

2232
const App = () => {
23-
return <Activity />;
33+
return <ArrowUpCircle />;
2434
};
2535
```
2636

2737
Icons can be configured with inline props:
2838

2939
```javascript
30-
<Activity stroke="red" fill="#fff" width={32} height={32} />
40+
<ArrowUpCircle stroke="red" fill="#fff" width={32} height={32} />
3141
```
3242

3343
You can also include the whole icon pack:
@@ -36,7 +46,7 @@ You can also include the whole icon pack:
3646
import * as Icon from "react-native-feather";
3747

3848
const App = () => {
39-
return <Icon.Activity />;
49+
return <Icon.ArrowUpCircle />;
4050
};
4151
```
4252

0 commit comments

Comments
 (0)