Opa e ae, então na doc deles já tem uma instrução legal sobre e ode ver a parte de exemplos no github da Vercel: https://nextjs.org/docs/basic-features/font-optimization
Também pode dar uma olhada nesse artigo: https://upmostly.com/next-js/how-to-add-google-fonts-to-your-next-js-app
Apesar de eles adicionarem direto nos elemtnos html aí, eu coloquei nos estilos mesmo. No meu caso estou usando Styled-components e arquivos .ts para criar os estilos.
Ficou algo mais ou menos assim:
const roboto = Roboto({
weight: ['400', '500'],
subsets: ['latin'],
});
{
font-family: `${roboto.style.fontFamily}, sans-serif`,
}