Hi Breakdance team,

I’m experiencing an issue with image handling in Breakdance when using the <picture> tag.

Problem:

When I use the native <picture> HTML element (to serve WebP and fallback formats), Breakdance does not apply the image settings configured in the Breakdance UI, such as:

1) loading="lazy"

2) Width/height attributes

3) srcset or responsive image behavior

4) Custom classes or AOS animations

5) Styling (e.g., border-radius or shadows)

This results in inconsistent rendering compared to using a standard <img> block provided by Breakdance.

Example:

<picture>

<source srcset="/example.webp" type="image/webp" />

<img src="/example.jpg" alt="Example Image" />

</picture>

In this case, none of the Breakdance global or per-image settings are applied to the <img> inside the <picture> tag.

⸻

Suggestion:

It would be great if Breakdance:

1) Applied global/default image settings to <picture> blocks when used

2) Provided native support for <picture> in the UI (e.g., a “Responsive Image” block with WebP support)

3) Or at least offered an option to enable image optimization features for manually added <picture> tags

Let me know if this is a known limitation or if there’s a recommended workaround.

Thanks!