Is there a way to toggle png images according to the theme in use?

[MankiratSingh1315]

For example if I want some black png to appear if light theme is applied and a white png on dark theme...

[mc7h]

Hi @MankiratSingh1315 — I achieved it this way:

---
date: '2025-05-18T17:32:11+10:00'
draft: false
title: 'My First Post'
---

Hi there!


<style>
body.dark .light-img {
    display:none
}

body:not(.dark) .dark-img {
    display:none
}
</style>

<img src="/dark.png" alt="Logo" class="dark-img">
<img src="/light.png" alt="Logo" class="light-img">

However, I had to turn on unsafe in my config.

markup:
  goldmark:
    renderer:
      unsafe: true

Otherwise the raw tags are stripped out.

Demo:
https://github.com/user-attachments/assets/b1487553-e43b-4938-aa8d-4ada9602fb45

[MankiratSingh1315]

Works Perfectly!
Thankyou.

I need friends like yours, though. 😂