I just started learning React Native and I have to admit that, it’s super easy to start with and hot-reloading makes it amazing to develop and reload the application in no time.
But is that all? A big NO.
Being a UI designer, fonts matter a lot to me and the custom fonts play an important role when it comes to building a decent looking user interface.

How to Add Custom Fonts

Today, I’ll show you how easy it is to add and use custom fonts in your React Native project.
Step 1: Open terminal, go to the project root directory and run
mkdir assets && mkdir assets/fonts
Step 2: Copy your custom font to the
assets/fonts
folder.
Step 3: Create a file in the root directory with as:
touch react-native.config.js
Step 4: In
react-native.config.js
file add the below code snippet
module.exports = {
     assets: ["./assets/fonts"]
}
Step 5: Now, run the below command to link the assets to your react native project:
npx react-native link
To verify if the font is been linked or not, go to android/src/main/assets folder and check if your font has been added to the directory.

Using a custom font 🚀

Suppose below is the Text for which we want to use our custom font. Now let’s give it a style
<Text style={{styles.text}}>
    Getting started with React Native.
</Text>
Define styles to use the custom font as:
const styles = StyleSheet.create({
    text: {
        fontFamily: 'YOUR_FONT_FILE_NAME'
    },
});
And we are done! Enjoy the styling.
This is my first-ever tutorial, so pardon me for being boring and please let me know your suggestions on Twitter and in the comments below!