next/image "hostname is not configured under images": remotePatterns Fix, Tested on Next.js 16

By Afaq Rashid · November 9, 2026

next/image doesn't load remote images directly. It sends them through your own server at /_next/image, which resizes them. To stop anyone using your server to fetch any URL on the internet, Next only does this for hosts you list in next.config. Use an image from a host that isn't listed and you get this error.

I tested it on Next.js 16.4.4 in dev and in a production build, including the cases that fail differently: production, localhost, and image URLs with query strings.

The fix: remotePatterns

// next.config.ts
import type { NextConfig } from "next";

const config: NextConfig = {
  images: {
    remotePatterns: [
      new URL("https://cdn.shopify.com/**"),
      { protocol: "https", hostname: "images.ctfassets.net", pathname: "/**" },
    ],
  },
};

export default config;

Either form works: a URL object (the short form, in recent versions) or an object with protocol, hostname, and optionally port and pathname. With the host listed, the optimizer returned the image as a PNG with status 200. Restrict pathname where you can, for example to your own bucket's folder, so the rule doesn't open the whole host.

For subdomains, "*.example.com" matches one level (cdn.example.com) and "**.example.com" matches any depth. The hostname has to match exactly otherwise: www.example.com and example.com are different hosts.

Dev shows the error, production doesn't

next dev:
Error: Invalid src prop (https://www.afaqrashid.com/favicon-96x96.png) on `next/image`,
hostname "www.afaqrashid.com" is not configured under images in your `next.config.js`
-> page returned 500

next build + next start:
build passed, page returned 200
/_next/image?url=... returned 400 with the body: "url" parameter is not allowed

That's the dangerous one. In production nothing fails at build time and the page loads, but every image from that host shows as broken. If you see broken images only in production, open the image URL from the page's source in a new tab. A 400 with "url" parameter is not allowed means the host isn't in remotePatterns, or the pattern doesn't match the exact protocol, host, port and path.

"hostname localhost is not configured" and private IPs

A local image server (a CMS on localhost, a Docker service, a LAN IP) hits a second check in Next 16. Even with localhost listed in remotePatterns, the optimizer still returned 400, and the server log said:

upstream image http://localhost:1470/x.png hostname resolved to private IP ["::1","127.0.0.1"]
If this is expected and you understand SSRF risk, use images.dangerouslyAllowLocalIP = true to continue.

images: {
  dangerouslyAllowLocalIP: true, // only for local development
  remotePatterns: [{ protocol: "http", hostname: "localhost", port: "1337" }],
},

With that set, the same image loaded. Keep it out of production config: the check exists so visitors can't make your server request internal addresses. Set it only when NODE_ENV is development, or use unoptimized on images from the local server.

Local images with a query string

Error: Image with src "/logo.png?v=2" is using a query string which is not configured in images.localPatterns.

This one failed the build. Next 16 rejects query strings on local images unless you allow them. Drop the query string, or add localPatterns: [{ pathname: "/logo.png" }] with no search field, which let it through in my test.

images.domains still works, with a warning

The old images: { domains: [...] } setting still loaded the image on Next.js 16.4.4, but both build and start printed "images.domains is deprecated in favor of images.remotePatterns". Move to remotePatterns: domains allows every path and protocol on the host.

When to use unoptimized instead

With the unoptimized prop the img tag pointed straight at the remote URL, and no config was needed. That's reasonable for images that are already small and sized (icons, SVG logos), or for hosts that already resize images on their own CDN. You lose automatic resizing and modern formats, which usually matter for LCP.

All results come from one Next.js 16.4.4 project on Node 26, with the image responses read straight from /_next/image.