Custom Font

[hearty furnace]

Show the best approach using a custom font (self hosted within the app, not a google font) within next.js 14 app router.

[lusty moon]

Hi @hearty furnace. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

---

Hmm, I don't know enough to give you a confident answer yet. The information extracts provided do not contain specific instructions on how to use a custom font (self-hosted within the app, not a Google font) within Next.js 14 app router.

However, you can refer to the Next.js documentation (https://nextjs.org/docs/app/api-reference/components/font) for more information on how to use the next/font module for font optimization.

For a more specific guide on using custom fonts, you might find this Vercel guide (https://vercel.com/docs/functions/edge-functions/og-image-generation/og-image-examples) useful. It provides an example of using a custom font in a Next.js application, although it's not specifically about Next.js 14 app router.

Please note that the information might not be directly applicable to your situation, and you may need to adapt the instructions to your specific needs.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: