Next.js Discord

Discord Forum

How to access local fonts from one source?

Unanswered
Brown bear posted this in #help-forum
Open in Discord
Brown bearOP
So right now I am doing something like this :

import localFont from "next/font/local";

const avenirfont = localFont({ src: "../../public/fonts/AvenirPro.ttf" });
const avenirfontLight = localFont({
  src: "../../public/fonts/AvenirProLight.ttf",
}); 


And then to use it :

<div className={styles.main} style={avenirfont.style}>

In the same file but if I need to use it in a different file I will have to create these objects again for the respective files, seems wrong. So how can I define these fonts globally and access them from anywhere?

1 Reply