title: Fade two images together in CSS
body: <p>Say I have these two images:</p>
  
  <p><img src="https://i.stack.imgur.com/kqa1P.jpg" width="200" />
  <img src="https://i.stack.imgur.com/UvGLY.jpg" width="200" /></p>
  
  <p>How do I combine them <a href="https://graphicdesign.stackexchange.com/questions/38952/how-to-fade-two-images-together-in-sketch">like this</a>, where one fades gradually into the other, using just CSS?</p>
  
  <p><img src="https://i.stack.imgur.com/TbqCW.png" width="400" /></p>
  
  <p>I need to do this using CSS because the images are user-supplied.</p>
  
  <p>I've tried using CSS gradients, multiple background images, and blending modes, but wasn't able to achieve what I wanted. Also, wasn't able to find what I needed by googling.</p>