Specific hover and resting effects for widget/div container

I want to copy exactly the same style as the siteorigin page builder when the mouse is hovered over an element (say header), the rest of the page is grayed out EXCEPT for that element.
I basically want my widget bar of 5 icon (buttons) to be grayed out when not hovered but when hovered pop out and become bright

I have two Images to show exactly what i’m trying to do, but can’t find a way to upload here.