¿Cómo añadir fuentes personalizadas utilizando Tailwind y NextJS?

Para añadir fuentes que hayas descargado y ubicado en la carpeta public debes primero definirla en tu globals.scss

@font-face {
  font-family: "Montserrat-Light";
  src: url("../public/fonts/Montserrat-Light.otf");
}

Cabe aclarar que yo en este caso transforme la font del formato standard al formato .otf para hacer esto puedes usar una herramienta online como esta.

Una vez hecho esto lo que se debe hacer es añadir la font a tailwind.config.js como se puede ver en el siguiente bloque:

theme: {

    extend: {





      fontFamily: {
        'sans': ['Proxima Nova', ...defaultTheme.fontFamily.sans],

        'montserrat-light': ['Montserrat-Light'],
      }
 },

Ahora simplemente debes definir la clase font-montserrat-light en el className de donde queramos añadir la font.