How do I select or change the color of different images ignoring transparent pixels?

Hi, I'm currently working in a game where I have a frame in which I distribute the images in differents positions and when I click it, the color should change. The problem is that Construct consideres each image as a square and when I click in field that it's currently white for an image and transparent for the other. The image higher (and with transparent pixel) is selected and the color is changed.

The image shows a part of how each image of the frame is positioned.

PS: Its a frame, with the images outlines. Each figure doesn't have an outline. I saw that I could change its color or pick an image with different color.

PS 2: I'm using SVG images.

Anyone knows a possible logic that I could follow to make this right? Or another path...?

I hope I explained my problem as clear as possible and I appreciate your help

I tried using the SVG images as Sprites and ajusting the collision poligons but the images lost quality after...

The easy option is to use sprites and define collision polygons outlining the actual shape in the image.

The harder option is detecting if the clicked pixel is transparent or opaque with a Drawing Canvas. On click pick all objects under the mouse cursor and start analyzing them from top to bottom (on z-axis). Put a small DrawingCanvas (like 2*2px) in the mouse position, paste one object, save snapshot, read pixel. If it's transparent, repeat this again for the object below etc., until you find the object with opaque pixel.