JSFiddle - React, Tailwind, and code Playground

HTML

<div style="
  --fallback-image: url('fallback.jpg');
  background-image: var(--fallback-image);
">
  Content goes here...
</div>

<style>
  @supports (background-image: url('image.webp')) {
    div {
      --fallback-image: url('image.webp');
    }
  }
</style>