<picture>

<picture>
  <source media="(min-width: 650px)" srcset="img_pink_flowers.jpg">
  <source media="(min-width: 465px)" srcset="img_white_flower.jpg">
  <img src="img_orange_flowers.jpg" alt="Flowers" style="width:auto;">
</picture>

HTML5 introduced the <picture> element to add more flexibility when specifying image resources.

Contains a number of <source> elements, each referring to different image sources, this way the browser can choose the image that best fits the current view and/or device.

Related concepts

<picture> — Structure map

Clickable & Draggable!

<picture> — Related pages: