What's the best way to install a custom font on Next.js?

[melishev]

Hi!
I tried to set my custom font via global.css, but Geist-ui takes precedence over any styles.
What is the best way to solve this problem in Next.js you can advise?

[melishev]

Okay, I found a solution for this problem after carefully reading the documentation.

First, of course, you need to import our font into the application.

In order to install a custom font, you need to customize the theme, as described here in the documentation

It is also necessary to add a "font" object with the name of your font inside:
const customTheme = Themes.createFromLight({ type: 'coolTheme', font: { sans: '"customFont"', }, })