How to define dark/light mode images in GitHub Markdown (#note)

I was just browsing the GitHub markdown docs to check something and spotted a new GitHub feature. 🙈 GitHub markdown finally supports light and dark mode images! It always bugs me when GitHub Readmes look super polished but include a terrible-looking "hero image" in the dark GitHub UI (or the other way around).

Use a URI fragment in the image URL to hide or show it depending on user preferences!

![Fancy logo](./dark.png#gh-dark-mode-only)
![Fancy logo](./light.png#gh-light-mode-only)

Here is it in action. 👇

I couldn't find official release notes about it, but the feature seems to be only a few days old. The new CEO shared it on Twitter, too.

While this approach seems smart, it comes with drawbacks. Appending #gh-dark-mode-only to an image URL works perfectly fine on github.com. That's not the only location many Readmes are rendered on, though. npm renders repo Readmes, blogs render repo Readmes, for any site but GitHub two images will be rendered using this new approach.

Thinking of npm, I'm sure they will adopt this syntax quickly (it's all Microsoft, right?), but it's probably too early to adopt this feature right now. And if you do, you better be sure that the Readme isn't rendered anywhere else because I don't see Markdown renderers implementing this soon...