Next.js Discord

Discord Forum

Font + Tailwind doc incomplete?

Unanswered
Alaskan Malamute posted this in #help-forum
Open in Discord
Avatar
Alaskan MalamuteOP
Is it possible this particular example is incomplete? it references mono: ['var(--font-roboto-mono)'], in the tailwind config but that font is not defined anywhere.

https://nextjs.org/docs/pages/building-your-application/optimizing/fonts#with-tailwind-css

3 Replies

Avatar
Alaskan MalamuteOP
this indeed looks incomplete, for tailwind to have access to a css variable, it would need this bit:

const inter = Inter({ subsets: ["latin"] });
const interMono = InterMono({
  subsets: ["latin"],
  variable: "--font-inter-mono",
});

function MyApp({ Component, pageProps }: AppProps) {
  return (
    <div className={cx([inter.className, interMono.variable])}>
Avatar
Yes it is incomplete
Avatar
Alaskan MalamuteOP
the whole page seems rather incomplete, I can do a pull request for this particular bit however