Open
Description
Link to the code that reproduces this issue
https://codesandbox.io/p/devbox/4grdtp
To Reproduce
I followed these steps to create the reproduction:
pnpm create next-app@canary --tailwind --yes
- Simply replace the component in
app/page.tsx
(orpages/index.tsx
) withreturn <span className="font-mono">Hello, world!</span>
To reproduce the issue based on the reproduction:
pnpm run dev
(orpnpm run build
thenpnpm run start
)- Navigate to
http://localhost:3000/
- (Open browser developer tools)
Current vs. Expected behavior
Provide environment information
Operating System:
Platform: linux
Arch: x64
Version: #1 SMP PREEMPT_DYNAMIC Sun Aug 6 20:05:33 UTC 2023
Available memory (MB): 4242
Available CPU cores: 2
Binaries:
Node: 20.12.0
npm: 10.5.0
Yarn: 1.22.19
pnpm: 8.15.6
Relevant Packages:
next: 15.2.0-canary.61 // Latest available version is detected (15.2.0-canary.61).
eslint-config-next: N/A
react: 19.0.0
react-dom: 19.0.0
typescript: 5.4.5
Next.js Config:
output: N/A
Which area(s) are affected? (Select all that apply)
create-next-app, CSS, Font (next/font)
Which stage(s) are affected? (Select all that apply)
next dev (local), next start (local)
Additional context
Introduced in #75407
Removing @theme
section (below) from globals.css
can address this issue but then we can't benefit from Vercel's Geist Font.
@theme {
--font-sans: var(--font-geist-sans);
--font-mono: var(--font-geist-mono);
}