Add Custom Fonts In React Native

Photo by Vladislav Klapin on Unsplash

In this article we will see how to add custom fonts in React Native .

Step → 1

First create a folder called assets/fonts in the src directory and add .tff files.

fonts

Step → 2

Create react-native.config.js file in the root directory

and paste the below code there.

module.exports = {
    project: {
      ios: {},
      android: {},
    },
    assets: ['./src/assets/fonts/'],
  };

Here we defines the path of the font directory.

Step → 3

npx react-native-asset

Hit this command on the terminal. This will generate the fonts folder in both Android and iOS App.

When you open android folder in the android studio, a assets/fonts folder will be there.