Gradient Mobile Menu

gradient mobile menu.png

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.

// Gradient Mobile Menu //

.is-mobile-overlay-active .Mobile-overlay-menu {
background-color: #000000;
background: linear-gradient(to bottom, #F07C63, #E45372);
width: 100%;
z-index: 1;
}

Step Three

Change both of the #F07C63 and #E45372 values to the colors of your choice.

Set the background color value to a darker color. In case the gradient colors don’t load properly, this color will display instead.

Save and refresh the page. 👍

Moov Labs