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!

Copy Code

/* soliud background color - change the #00FF00 color */
.header-nav-folder-content{
  background-color:#00FF00!important
}

Copy Code

/* linear gradient background */
.header-nav-folder-content{
background:linear-gradient(to bottom, #fee7ef,#c4e9fa)
}