Skip to content

Accessibility · Next.js (App Router)

How to stop disabling pinch zoom in Next.js (App Router)

Disabling pinch-zoom removes the only way many people with low vision can read a page on a phone. It is a WCAG failure, and the meta tag that causes it is usually copied in without anyone deciding to.

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.

ts code
// app/layout.tsx
import type { Viewport } from "next";

export const viewport: Viewport = {
  width: "device-width",
  initialScale: 1,
  // Do not set maximumScale or userScalable — the defaults allow zoom.
};

If you added userScalable: false to stop iOS zooming on input focus, set font-size: 16px on your inputs instead.

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.