I wanna save div as image I try many way like use html2canvas and htmlshot and DOM to Image

but do not work correnty for filter style and also backgroundimage. I set background image from local url

my div that I want convert it to the image has this style: filter (blur - grayscale - sepia - brightness - invert - hue-rotate) and background-image

I use html2canvas like this:

div style

#root {
    background-image: url("wallpaper.jpg");
    background-size: 100% 100%;
    background-position: center;
    width: 355px;
    height: 355px;
    border-radius: 4px;
    margin-bottom: 5px;
    filter: invert(82%) blur(0.5px) grayscale(100%) sepia(1) 
            brightness(0.8) hue-rotate(180deg) saturate(2);
  }

JS code

 <script src="htmlcanvas.js"></script>
<script>
 html2canvas(document.getElementById("root")).then(function(canvas) {
    document.body.appendChild(canvas);
  });
</script>

and this is output:

output