Element: #128 srcset and sizes (display/image) What it shows: An Image with a two-rendition `srcset` (400w and 800w) and a `sizes` hint, in a 420px wrapper. When to use: Responsive content images where the browser should pick the smaller file on narrow screens. Spec: - `srcset={`${small} 400w, ${large} 800w`}` lists two renditions - `sizes="(min-width: 768px) 420px, 100vw"` - `src={large}` with `width={800}` and `height={450}` - `alt="Two renditions of the same 16 by 9 picture"` - Wrapper is `

` Tags: image, srcset, sizes, responsive, alt, width Needs: @codeatlasdev/ui@4.4.0 Components: Image Live demo: https://ui.codeatlas.com.br/docs/display/image#srcset-and-sizes

Two renditions of the same 16 by 9 picture