If you're looking for the calculator, it's now available again on my website:
Here is a practical example (works best on Firefox)
#test {
width: 100%;
height: auto;
mask: url(#m1);
}
<svg x="0px" y="0px" width="250px" height="250px" viewBox="0 0 250 250">
<defs>
<mask id="m1" maskUnits="objectBoundingBox" maskContentUnits="objectBoundingBox">
<path style="fill-rule:evenodd;clip-rule:evenodd;fill:#ffffff;" d="M0.796,0L0.172,0.004C0.068,0.008,0.008,0.068,0,0.172V0.824c0,0.076,0.06,0.16,0.168,0.172h0.652c0.072,0,0.148-0.06,0.172-0.144V0.14C1,0.06,0.908,0,0.796,0zM0.812,0.968H0.36v-0.224h0.312v-0.24H0.36V0.3h0.316l0-0.264l0.116-0c0.088,0,0.164,0.044,0.164,0.096l0,0.696C0.96,0.912,0.876,0.968,0.812,0.968z"
/>
</mask>
</defs>
</svg>
<img src="https://placebear.com/g/200/200" id="test" alt="">
How Does It work:
The calculator divides dimensions obtained from SVG path by the SVG width (or Height, always use highest as your input), and then displays the output.
Example:
M199.468,0L43.883,1.317C17.289,2.632,2.66,17.106,0,43.423V206.58c0,19.738,15.958,40.789,42.552,43.42
h163.563c18.619,0,37.235-15.788,43.885-36.84V35.526C250,15.89,227.399,0,199.468,0z M203.456,242.105H90.424v-56.578h78.458
v-60.526H90.424V75.001h79.787l0.032-66.524l29.961-0.106c22.944,0,41.511,11.853,41.511,24.903l0.304,174.624
C240.691,228.949,219.415,242.105,203.456,242.105z
is equal to (responsive result):
M0.796,0L0.172,0.004C0.068,0.008,0.008,0.068,0,0.172V0.824c0,0.076,0.06,0.16,0.168,0.172h0.652c0.072,0,0.148-0.06,0.172-0.144V0.14C1,0.06,0.908,0,0.796,0zM0.812,0.968H0.36v-0.224h0.312v-0.24H0.36V0.3h0.316l0-0.264l0.116-0c0.088,0,0.164,0.044,0.164,0.096l0,0.696C0.96,0.912,0.876,0.968,0.812,0.968z