Retina image support (@1x @2x @3x) I've been struggling for a while to figure out how to support higher pixel density screens for my images in drupal. I have 3 variations for every image on the site (@1x, @2x, @3x) but I haven't been able to find an easy way to use them. I searched around and found articles like: 
https://www.advomatic.com/blog/adding-responsive-images-to-your-drupal-8-site
and https://evolvingweb.ca/blog/making-drupal-websites-retina-ready

but they usually talk about using the retina module for drupal which seems to not pass security adviory policy or are just adding different image styles and using the picture tag. Is there no way to use just srcset and using 3 different images for different dpi in drupal? 

Ideally I'd like to have an image field which will just let me upload 3 images for different dpi.
I think the answer from @ipwa is close but is not quite there.

What you want is an output like this:

&lt;img src="/fallback.jpg" srcset="/1x.jpg 1x, /2x.jpg 2x, /3x.jpg 3x" /&gt;


Here's what you need to do:


Enable both the Breakpoint and Repsonsive Image Style modules.
Add an image field for uploading 1 image to a content type. Editors should upload the highest quality image needed.
Configure three normal image styles that produce the desired resolutions for each of the 1x, 2x, and 3x pixel densities.
In your theme, or a custom module, create a breakpoint yaml file with the following contents:


my_module_or_theme.image_pixel_density_only:
  label: Pixel Density Only
  mediaQuery: ''
  weight: 0
  multipliers:
    - 1x
    - 2x
    - 3x



Rebuild caches.
Add a new responsive image style.
Configure the responsive image style so that it uses the breakpoint group that you just created. This should expose a 1x, 2x, and 3x fieldset. For each of these fieldsets, select type "Select a single image style." and choose the appropriate image style.
Configure the image field formatter for image field you created in step 1 to use the responsive image style you just created.


Drupal will output the srcset just like I described above and will not output a "sizes" attribute (which you don't need). Browsers will know what the pixel density is of the device and automatically select the most appropriate image based on that.