vercel/next.js · error · Error

Image with src "${src}" has invalid "placeholder" property "

Error message

Image with src "${src}" has invalid "placeholder" property "${placeholder}".

What it means

Props validation in getImgProps: the placeholder value is neither 'empty', 'blur', nor a data: URI. Placeholder support is limited to those forms, so anything else (e.g. an arbitrary string) is rejected before it reaches the img markup.

Source

Thrown at packages/next/src/shared/lib/get-img-props.ts:567

        `Image with src "${src}" has both "priority" and "loading='lazy'" properties. Only one should be used.`
      )
    }
    if (preload && loading === 'lazy') {
      throw new Error(
        `Image with src "${src}" has both "preload" and "loading='lazy'" properties. Only one should be used.`
      )
    }
    if (preload && priority) {
      throw new Error(
        `Image with src "${src}" has both "preload" and "priority" properties. Only "preload" should be used.`
      )
    }
    if (
      placeholder !== 'empty' &&
      placeholder !== 'blur' &&
      !placeholder.startsWith('data:image/')
    ) {
      throw new Error(
        `Image with src "${src}" has invalid "placeholder" property "${placeholder}".`
      )
    }
    if (placeholder !== 'empty') {
      if (widthInt && heightInt && widthInt * heightInt < 1600) {
        warnOnce(
          `Image with src "${src}" is smaller than 40x40. Consider removing the "placeholder" property to improve performance.`
        )
      }
    }
    if (
      qualityInt &&
      config.qualities &&
      !config.qualities.includes(qualityInt)
    ) {
      warnOnce(
        `Image with src "${src}" is using quality "${qualityInt}" which is not configured in images.qualities [${config.qualities.join(', ')}]. Please update your config to [${[...config.qualities, qualityInt].sort().join(', ')}].` +
          `\nRead more: https://nextjs.org/docs/messages/next-image-unconfigured-qualities`

View on GitHub (pinned to 0eb3775416)

Solutions

  1. Set placeholder to "blur" or "empty", or remove it.
Defensive patterns

Strategy: validation

When it happens

Trigger: next/image placeholder prop is invalid.

Common situations: Passing a value other than 'blur' or 'empty' as placeholder.


AI-assisted analysis of vercel/next.js@0eb3775416 (2026-08-19). Data as JSON: /api/errors/02fe7d7f1c877a9a. Report an issue: GitHub.