B&W To Color On Hover - Index Background

Install Steps

B&W To Color On Hover - Index Background

Submitted by Moov Labs Works with the Brine template family


Step One

From your Squarespace account, go to the Custom CSS Editor: Design > Advanced > Custom CSS

Step Two

Copy and paste the code below into the Custom CSS Editor box.

// BW To Color Index Page Image //

.Index-page--has-image {
  transition: filter .5s ease-in-out;
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);

.Index-page--has-image:hover {
  -webkit-filter: grayscale(0%);
  filter: grayscale(0%);

Step Three

You do not need to change any of the values or properties.

Save and refresh the page. 👍

Moov Labs