Hemendra Khatik
aamchora

aamchora

Custom fonts in react-native.

Hemendra Khatik's photo
Hemendra Khatik
·Jun 24, 2022·

1 min read

Subscribe to my newsletter and never miss my upcoming articles

Adding fonts in react-native app can be frustrating. If you are doing it for the first time. But trust me, it is as simple as it sounds. Follow the below steps carefully and it will work as expected.

  1. Download the fonts
  2. Create fonts folder inside the assets folder src/assets/fonts.
  3. Put all the font files inside the fonts folder.

react-native fonts

4.Now create react-native.config.js file in your app's root folder and paste below code in it.

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

Run the below command

npx react-native link

And voila, it's done now you can use the file name as your fontFamily name(don't put extension name after file name) and it will work like a charm.