The selection of SVG elements?

Hello!
There is a bit of SVG elements.
Curved.
But the contours of all these elements is the same, rectangular.
They are all in one container, all position:absolute, and all of the rectangles coincide with each other.
Ie hover we get a rectangle which is inscribed in the figure.
Interested in how to make their outlines are also curved, so we can restore each item individually. And they do not overlap each other.

Alternatively, it may be better to do this on Canvas? I do not know. Or the Converter may have from SVG to Canvas? I looked online, found some tools, but he is not very liked me.

Or if not a Canvas, how to cut SVG.

Or css clip-path?

here is an example.
https://codepen.io/Osbaldo.Dibbert/pen/qBErqBW?editors=1100
April 3rd 20 at 18:46
0 answer

Find more questions by tags CSSSVG