purple hover filter

I need a code that will turn gallery images on my home page from my portfolio thumbnails to a dusty purple filter and go back to full color when hovered over?

@rachy1105 I would suggest adding a purple background color to the containing div and then changing the opacity of the img on hover. If you send a link to your website, I'd be happy to send you some specific custom CSS, but I'll need to see the page first.

https://robin-echidna-8j8b.squarespace.com/config/

thank you so much!

is this the right link? 

that worked! what about a code to change the shape of the thumbnail? like a circle or at least make the corners rounded. 

I'm also wondering about adding a think black border to the photos.

you did so awesome on that first one! Thank you!

@rachy1105 perfect circles are tough and can be funky in some browsers because you have to force an aspect-ratio in order to get it to work, which some browsers don't like, but add these properties to the code with the background color from earlier:

.fe-block-yui_3_17_2_1_1694104930278_8932 .summary-thumbnail.img-wrapper {
	background-color: #7879a0;
	border-radius: 50%;
	aspect-ratio: 1/1;
}

For just simple rounded corners, you can adjust the border radius and remove the aspect ratio... and also add the black border you want:

.fe-block-yui_3_17_2_1_1694104930278_8932 .summary-thumbnail.img-wrapper {
	background-color: #7879a0;
	border-radius: 25px; /* play around with this number */
	border: 10px solid #000;
}

The cirlces worked again! You're awesome thank you!

One other thing I'm wondering. 

Adding a lighting bolt cursor that works across all the pages? 

@rachy1105 There are a number of built-in cursor tools, but no lightning bolts. You would have to create the lightning bolt image yourself (or pull from stock imagery) and upload the graphic to your site, then use CSS to assign it. Here's an article that outlines the built-in ones as well as how to create your own:

https://blog.logrocket.com/creating-custom-mouse-cursor-css/