Adding Custom Fonts in React Native

1. Download Fonts: Go to a font site like Google Fonts, pick a font (e.g., "Briem Hand"), and download it.

2. Rename Files: After extracting the zip file, rename the font file to match its full name, like "Briem Hand.ttf".

3. Add to Project: Create a fonts folder inside your project's assets directory. Place your font file there.

4. Configure React Native: Create or edit react-native.config.js in your project root:

    module.exports = {
      assets: ['./assets/fonts/'],
    };
   

5. Link Assets: Run:

    npx react-native-asset
   

6. Use in Styles: In your styles, reference your font:

    const styles = StyleSheet.create({
      customText: {
        fontFamily: 'Briem Hand',
        fontSize: 30,
      },
    });
   

Now, your custom font should work on both iOS and Android!

Below is the example of this