"The trouble with having an open mind, of course, is that people will insist on coming along and trying to put things in it."
Terry Pratchet, Diggers
The <picture> tag is probably the easiest way to have an image "respond" to the screen size - displaying an image in its original dimension, but swap to an alternate or smaller dimension when in mobile, etc. example ..
<picture> <source srcset="img-640.jpg" media="(max-width:767px)"> <img src="img-1280.jpg" alt="" /> </picture>
But I just found out you can apparently use it to also swap images based on an OS's color scheme - dark vs light. I have personally not tried this trick yet, but this is a pretty cool tip!
PS. do take note of the <picture> browser compatibility before you use it for your client's websites - make sure their target or most visited audience uses a browser that supports the tag *coughs IE*.