@swiftread/fontawesome NPM

🎨 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 the svgs folder you downloaded
Run yarn install and yarn prepare
Commit your changes, and open a PR!