@swiftread/fontawesome
v0.0.10
Published
This library exports React Native components for each of FontAwesome's 2,025 free icons.
Downloads
58
Readme
🎨 React Native FontAwesome
import { FaSolidAddressBook } from '@swiftread/fontawesome'
export const Icon = () => <FaSolidAddressBook />
Overview
This library exports React Native components for each of FontAwesome's 2,025 free icons. Based on nandorojo's react-native-heroicons.
- 😎 Free, beautiful icons
- 🔥 Customizable with
react-native-svg
props - 🌲 Tree-shaken components
- 🤖 TypeScript support
- 📈 JS-only (+ works with Expo)
Installation
yarn add @swiftread/fontawesome react-native-svg
Usage
Each icon is exported as its own component with an adjusted name.
For example, to use the solid address-book
icon, import FaSolidAddressBook
:
import { FaSolidAddressBook } from '@swiftread/fontawesome'
You can also import * as Fontawesome
:
import * as FontAwesome from '@swiftread/fontawesome'
export const Icon = () => <FontAwesome.FaSolidAddressBook />
For a full directory of components, see the FontAwesome website.
Custom color
<FaSolidAddressBook color="black" />
Custom size
<FaSolidAddressBook height={30} width={30} />
Props
Each icon component accepts all the props from react-native-svg
's Svg
component. Reference their docs.
How it works
This library uses react-native-svg
. The components are generated by svgr
. I downloaded all the free icons from FontAwesome and ran a script to codegen the files from there.
Contributing
Since FontAwesome updates their icons somewhat frequently, you may want to import the new ones. These are the steps to update this library with new icons:
- Fork this repo
- Download the full folder of free icons from FontAwesome
- Replace the
generate/fontawesome/svgs
folder with the thesvgs
folder you downloaded - Run
yarn install
andyarn prepare
- Commit your changes, and open a PR!