Image reveal on hover

Hi hi!!

Anyone has an idea how to make image appears when hover over a code block/ markdown block? I tried markdown block code that was suggested on here before and it doesn't work. 

I'm working on this site: https://transformersfoundation.org/annual-report-2024. 

What I'm looking for:
- When hover over the grey shape it changes colour.

My problem: 
- I can't use this code since the hover image is full size of the original image 😞

#block  {

opacity: 0;

transition: opacity 1s

}

#block:hover {

opacity: 1;

transition: opacity 1s

}

My question:
1. If there is a way to have a photo appears on hovering over a code block? 

2. If there is a smarter way of making the grey shapes change their colours on hover?

Thank you so much!

Do you want each grey shape to change colour independently?

Yes that's the goal!!

Right now my plan is to export the coloured graphics individually.