How do I change font family in react native?

Question

Example Fonts

I want to use special fonts in my React Native project. Sample I downloaded Aleo font and put it in assets/fonts folder. I want use Aleo font. I've tried this. box:{fontFamily:'Aleo'} but not working. What is the problem ?

Answer 1

You have to link fonts to android and ios project.

So first create react-native.config.js file in root of your project and add this:

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

then run react-native link to link fonts to android and ios project.

Answer 2

Did you add the following code in react-native.config.js

for React Native Version ≥ 0.60

module.exports = {
  project: {
    ios: {},
    android: {}, // grouped into "project"
  },
  assets: ["./assets/fonts/"], // stays the same
};

And running react-native link after adding above.

For more detail you can follow this : https://medium.com/@mehrankhandev/ultimate-guide-to-use-custom-fonts-in-react-native-77fcdf859cf4