Use case:
I maintain a personal blog powered by Obsidian and Hugo, where I use relative image paths like 
that work seamlessly in both environments. To improve site performance, I want to leverage responsive images using the HTML srcset
attribute to serve different image sizes based on screen resolution and viewport.
Problem:
When I try to embed images using an <img>
tag with srcset
inside Obsidian, for example
<img
src="images/image-640.webp"
srcset="images/image-320.webp 320w, images/image-640.webp 640w, images/image-1024.webp 1024w"
sizes="(min-width: 1024px) 1024px, (min-width: 640px) 640px, 320px"
alt="Image"
/>
The image does not render inside Obsidian. Removing the srcset
attribute makes it render again.
Proposed solution:
Add native support for the srcset
attribute in Obsidian’s image embedding/rendering system so that responsive images can be previewed and managed directly within Obsidian without breaking the live rendering.
Disclaimer:
I am not sure if this is a valid or feasible request, as I am not fully aware of Obsidian’s current rendering limitations or design constraints related to this feature.