Next.js Discord

Discord Forum

How to use custom font.tff with nextjs 14

Answered
Naeemgg posted this in #help-forum
Open in Discord
In latest next 15 its very easy to use, I'm still using 14 because of deps breaking. I would like to know how can we use custom font files.
Answered by B33fb0n3
you can use [localfonts](https://nextjs.org/docs/14/app/building-your-application/optimizing/fonts#local-fonts) for that. Pretty easy to install: (see attached)
Green arrow: adding it.
Red arrow: using it.

In this example its a .woff2 but you can also use a .tff file
View full answer

6 Replies

@Naeemgg In latest next 15 its very easy to use, I'm still using 14 because of deps breaking. I would like to know how can we use custom font files.
you can use [localfonts](https://nextjs.org/docs/14/app/building-your-application/optimizing/fonts#local-fonts) for that. Pretty easy to install: (see attached)
Green arrow: adding it.
Red arrow: using it.

In this example its a .woff2 but you can also use a .tff file
Answer
Thanks man let me try it
@Naeemgg solved?
@B33fb0n3 <@782907171721314315> solved?
Yeah sorry I forgot to mark it solved
Thanks again 😀
happy to help