Is there a way to apply a @next/font with a variable without wrapping my entire application in a div for example? I'm using Tailwind, and I don't think there's another way to use @next/font with it. I'm using the /pages directory, so I don't have a root layout.
#@next/font with Tailwind without wrapper
steel cedar
dense orbit
Is there a way to apply a `@next/font` with a variable __without__ wrapping my e...
There are shared layouts even in /pages. Have a look at _app.tsx
steel cedar
There are shared layouts even in /pages. Have a look at _app.tsx
I'm using _app, was wondering if there was a way to apply the font without wrapping my application in another element to apply it.
dense orbit
I'm using `_app`, was wondering if there was a way to apply the font without wra...
Sure, add a global CSS
You can use stylesheets and tailwind together.
steel cedar
Sure, add a global CSS
The issue is that I don't know what to put in that stylesheet. @next/font's font name is dynamically generated, so it's not as simple as just telling it to use "Inter."
The recommended approach to use Tailwind with @next/font is with a variable, but I can't figure out how to set that variable without a wrapper element. https://nextjs.org/docs/basic-features/font-optimization#with-tailwind-css