I'm sure someone will call me a slowpoke on this, but one really cool thing that I didn't know about until recently was that you can also use this in images with srcset's, to display a darker image. For example, if you want to put the "Made with Bulma"[0] tag on your website, they offer a light and dark version, which you could use like this:

  <picture>
    <source srcset="made-with-bulma__dark.png" media="(prefers-color-scheme: dark)">
    <img alt="Made with bulma" src="made-with-bulma" width="128" height="24">
  </picture>

This will automatically replace with the image src when the srcset criteria is met, but keep all the other tags!

[0]https://bulma.io/made-with-bulma/