[amp-img] Support media features or dark mode

Author: EptagoneCreated May 26, 2026Updated May 28, 2026

LabelsType: Feature Request

Description

Without AMP, a dark mode version of an image can be set via <source> like this:

xml

<picture>
  <source srcset="/dark-image.png" media="(prefers-color-scheme: dark)" />
  <img src="/image.png" width="100" height="100" />
</picture>

However, the amp-img component doesn't seem to have an option like that right now.

Maybe it could work in a similar way to the fallback image:

xml

<!-- Proposal -->
<amp-img alt="Image"
  width="100" height="100"
  src="/image.png"
>
  <amp-img alt="Image"
    dark
    width="100" height="100"
    src="/dark-image.png"
  ></amp-img>
</amp-img>

Alternatives Considered

Allow media to work like this:

xml

<!-- Alternative proposal with media -->
<amp-img alt="Image"
  width="100" height="100"
  src="/image.png"
>
  <amp-img alt="Image"
    media="(prefers-color-scheme: dark)"
    width="100" height="100"
    src="/dark-image.png"
  ></amp-img>
</amp-img>

Additional Context

No response

Source: ampproject/amphtml

View original on GitHub View discussion on GitHub