Next.js "Failed to fetch `next/font` ... Google Fonts" in CI

By Daniel Zoghalchali·Latchkey

next/font/google downloads and self-hosts the font files at build time. If the runner cannot reach fonts.googleapis.com (offline, proxy, or transient failure), the build throws and stops.

What this error means

next build fails with "Failed to fetch Inter from Google Fonts" and a fetch or network error, usually on locked-down or air-gapped CI, or intermittently on a flaky network.

Failed to compile.

./app/layout.tsx
`next/font` error:
Failed to fetch `Inter` from Google Fonts.

Common causes

The runner cannot reach Google Fonts

A proxy, firewall, or air-gapped environment blocks the outbound request next/font makes at build time.

A transient network failure during the fetch

A momentary DNS or connection error makes the one-shot font download fail and abort the build.

How to fix it

Self-host the font with next/font/local

1. Download the font files and commit them to the repo.
2. Switch from next/font/google to next/font/local pointing at those files.
3. Re-run next build so no network fetch is needed.

import localFont from 'next/font/local'
const inter = localFont({ src: './Inter.woff2' })

Allow the fonts host through the proxy

If you keep next/font/google, ensure the runner can reach fonts.googleapis.com and fonts.gstatic.com.

How to prevent it

• Self-host fonts with next/font/local for offline or locked-down CI.
• Allowlist Google Fonts hosts where build-time fetching is required.
• Retry the build on transient network errors.

Frequently asked questions

Related guides

References

• Node.js documentation
• npm CLI documentation
• GitHub Actions documentation