Transform a picture full of polygons shapes to code

Issue

I'm new to web/mobile app development. I'm using react-native.

I have a picture containing multiple polygonal shapes, let's say this one.

I'd like to transform each of theses shapes (in the picture) into multiple corresponding generated shape with code. I know I could do this manually using styles properties (width, border, top, left etc) but I don't really wan't to break my brain on figuring how to achieve it for each shapes, considering that I'd like to render more than 100 different shapes extracted from a picture.

Is there a tool or something that can generate automatically the styles code from uploading a picture ? Even if I could draw manually the shape in a picture editor, that then generate code, it would help me to save a lot of time.

Thanks

Solution

Found how I could do it, I'll just use the lib https://github.com/react-native-svg/react-native-svg

Answered By - diiaeac