HTMLworkingevergreen
Responsive images
One <img>, many sources.
Let the browser pick the right file for the screen with srcset and sizes, switch art direction or formats with <picture>, and defer offscreen loads with loading=lazy.
Density descriptors (1x / 2x)
HTML+CSS+JSintro Press Run to execute
The image always paints at the same 120px box, but the browser silently swaps in the 240×240 2x candidate on Retina/HiDPI displays and the smaller 1x one elsewhere — so a low-DPI preview shows the 1x tile and a HiDPI screen shows the crisper 2x tile at identical layout size.