PNG in <img> tag in dark mode in Chrome

You could use the element for you image. Inside the element you can use elements. These source elements can use a media query, like in CSS, to determine if it should show based on the query.

In your case you could check the prefers-color-scheme: dark query to see if dark mode is enabled.

If it is not enabled then the default src on the image is used. If it is enabled then the srcset on the element will be used as the new value for the src on the image.

<picture>
  <source srcset="dark-image.jpg" media="(prefers-color-scheme: dark)">
  <img src="light-image.jpg" alt="Animated wave shape">
</picture>

try to add !important to your filter property.

filter: none !important;