Change Dropdown Folder Background Colour on Squarespace

One thing that should be really easy to do on Squarespace but isn’t is changing the colour of your dropdown folders.

You CAN change it within your theme colour schemes, but then the folder has to match the header. If you want the folder to be a different colour to the header then you need to use some custom code.

Let’s take a look…

Watch the video

Check out the YouTube video below 👇

Head to Website > Website Tools > Custom CSS and add the following code to your custom CSS box:

.header-nav-folder-content {

background: #000 !important;

}

You can edit the colour within the code to be whatever you want, using hex codes, RGB codes or even just writing in the colour.

---

📩 Join the inner circle to get exclusive code updates

---

Once you’re happy, hit save and you’ll have changed the colour of your dropdown folders, making them a different colour to your header. Easy!

---

Your designer

I'm Sam, an award-winning Squarespace web designer. I have worked with every type of business, building platforms for solo entrepreneurs through to multi-million dollar corporations. If you want to discuss a potential project, you can email on sam@bycrawford.com or get in touch with me here. Alternatively, you can book in a free 15-minute consultation call here.

---

Want more?