I am in need of creating a design featuring numerous non-rectangular shapes that are interactive and reveal an image when clicked. The concept is to transform an image of stained glass into a webpage where each pane can be clicked to unveil its colorful version, similar to the stained glass windows found in churches.
My vision for this project involves two main components: a colored version of the entire stained glass image, overlaid with a black and white version. Each individual glass pane should be clickable, with a click event toggling between the black and white view and the colored view.
Although I have not discovered a specific approach for achieving this effect with such complex shapes and interactive elements, I have provided an example below to illustrate the desired outcome. In this scenario, each glass segment would be clickable and transition from monochrome to color upon interaction.
The white lines in the image serve to indicate that each pane operates independently from the others, enhancing the interactivity of the design.