How to customize the dropdown menu background in Squarespace

You’ll find a lot of options in your Squarespace design menu, but unfortunately, changing the background color of your dropdown menu isn’t one of them. 🫠 Luckily, a little custom CSS can help you make that dropdown folder unique! Use the code below to create a higher contrast, or even add a linear gradient if you want to be really creative.

Under the code you’ll also find a link to a tutorial video that will teach you some more creative customization tricks for your dropdown. It’s definitely worth watching if you want to be inspired!

/* soliud background color - change the #00FF00 color */
.header-nav-folder-content{
  background-color:#00FF00!important
}
/* linear gradient background */
.header-nav-folder-content{
background:linear-gradient(to bottom, #fee7ef,#c4e9fa)
} 
 
How to customize the dropdown menu background in Squarespace
insidethesquare


Grab my collection of custom codes for Squarespace: 
→ insidethesquare.co/css

https://insidethesquare.co
Previous
Previous

How to change your logo on a specific page in Squarespace

Next
Next

How To Customize Bullet Points in Squarespace