FROM CACHE - en_header

brooklyn- dropdown menu background colour change and opacity

New Member
6 0 0

Hi there, 

I have been trying to find out how to change the colour of the dropdown menu background only but have been very unsuccessful. 


I have located the where abouts of the dropdown menu code but for some reason what ever I change it too it won't work 


Replies 4 (4)
Shopify Staff (Retired)
Shopify Staff (Retired)
142 0 14

Hi Jack,

Brian here from the Shopify support team 🙂

I can show you how to do so - Just follow these steps:

- In your Admin, go to Online Store > Themes > Beside the blue Customize theme button, click the button with the three small dots and then choose this option "Edit HTML/CSS".

- In the Assets folder, choose the theme.scss.liquid file.

- Search for line 2519, and you will see the variable "background-color:" - Change that color to what you want, and you will be good to go. (Use a hexadecimal value for the color - Example: #FF0000 being red).

This will help you out, and if you need more guidance with this, just reply to my answer 🙂

Kind regards,

Shopify Guru


New Member
6 0 0

Hi there, 

thanks a lot but not the entire drop down is not the colour i want it to be. please could you help me and make the text on the header and the dropdowns white? 




New Member
2 0 0

It's in styless.sccs.liquid recently and looks something like this:

@mixin background-opacity($color, $opacity: 0.5) {
background: $color;
background: rgba($color, $opacity);

@mixin text-opacity($color, $opacity: 0.5) {
color: $color;
color: rgba($color, $opacity);

20 0 4

@Dannis I don't have a "styless.sccs.liquid" in my Brooklyn, has he name changed in later versions? I find some @mixin-lines in theme.scss.liquid but not @mixin background.


Thanks on before hand