What are Responsive Images?

Responsive images serve appropriately sized assets based on device, DPR, and layout.

When to use Responsive Images?

Use responsive images on media-heavy pages and cards across breakpoints.

What is the anatomy of Responsive Images?

The anatomy includes srcset, sizes, picture, and media queries, art direction vs. resolution switching, lazy loading, and formats such as WebP, AVIF, and SVG.