How to replace pattern in SVG?

Question

SVG

There is the following code:

<svg width="114" height="131" viewBox="0 0 114 131" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
                                <path d="M56.9886 0.986084L113.153 33.4125V98.2654L56.9886 130.692L0.824379 98.2654V33.4125L56.9886 0.986084Z" fill="#0D1126"/>
                                <path d="M56.9886 0.986084L113.153 33.4125V98.2654L56.9886 130.692L0.824379 98.2654V33.4125L56.9886 0.986084Z" fill="url(#pattern0)"/>
                                <defs>
                                    <pattern id="pattern0" patternContentUnits="objectBoundingBox" width="1" height="1">
                                        <use xlink:href="#image0" transform="scale(0.005)"/>
                                    </pattern>
                                    <image id="image0" width="200" height="200" xlink:href="img.jpg"/>
                                </defs>
                            </svg>

This code is automatically made by Figma, when I make a second SVG with only a different url, the image is still the first one, how can I fix it?

Answer 1

What exactly are you replacing? By replacing the link in the xlink:href attribute of the image element everything works well, everything changes.
CSS has clip and clip-path to create a mask, you may find it useful