Nuxt Image Nuxt Image

<nuxt-picture>

Discover how to use and configure the nuxt-picture component.

<nuxt-picture> is a drop-in replacement for the native <picture> tag.

Usage of <nuxt-picture> is almost identical to <nuxt-img> but also allows serving modern formats like webp when possible.

Learn more about the <picture> tag on MDN

Props

See props supported by nuxt-img

legacyFormat

Format used for fallback. Default is conditional:

  • If original format supports transparency (png, webp and gif), png is used for fallback
  • Otherwise jpeg is used for fallback
<nuxt-img>
API Module Options