Skip to content

Compliance · Next.js (App Router)

Is loading Google Fonts from the CDN a GDPR problem in Next.js (App Router)

Loading fonts from Google's CDN at request time transmits every visitor's IP address to Google. A German court (LG München I, 3 O 17493/20) awarded damages for exactly this, and it triggered a wave of demand letters. Self-hosting the files removes the transfer entirely, is a one-line change in most frameworks, and is also faster.

The fix for Next.js (App Router)

13x detects your framework from the response and hands you this version rather than the generic one — below 50% confidence it hedges and gives you the generic one instead.

Use next/font, which downloads the font at build time and serves it from your own domain. No request ever reaches Google at runtime:

ts code
// app/layout.tsx
import { Inter } from "next/font/google";

const inter = Inter({ subsets: ["latin"], display: "swap" });

export default function RootLayout({ children }) {
  return (
    <html lang="en" className={inter.className}>
      <body>{children}</body>
    </html>
  );
}

Despite the import path, this is self-hosting: the files are fetched during the build and emitted as static assets. Then remove any remaining <link> to fonts.googleapis.com — a leftover one in a CSS file or a <head> re-introduces the transfer.

On a different stack? The general version of this fix explains what 13x checks and why it matters, without assuming a framework.

Check your Next.js (App Router) site

113 deterministic checks against your live URL, in about 30 seconds. Framework detected from the response, so every fix comes back in the form your stack actually uses.

No signup. Results in 30 seconds.

The same fix, other stacks