How to add custom fonts in react-native and use the custom fonts using the tailwind-css (native-wind)
Hi while devloping the apps change fonts play a crucial in the ui , i found that there is no clear way of how to change fonts in the latest react native- cli so i came up with this solution..
- Download the .ttf folder from the google fonts
- add the .ttf to the ./assets/fonts/{your .ttf file
- Create a react-native.config.js (note the 2 dots)
- Paste this code
module.exports = {
assets: [‘./assets/fonts/’]
}
5. Run npx react-naitve-asset to link the fonts
6. Then go to the tailwind config add the font config as follows 🔧
theme: {
extend: {
fontFamily: {
k2d: [‘K2d’],
k2dbold:[‘K2DBold’],
yester:[‘Yesteryear’]
}
7. Restart the metro npx react-native run-android
8. Finally now you can use as many custom fonts you need