How to change the color of the hamburger menu?

Created by George R, Modified on Thu, 26 Sep at 10:35 AM by George R

The hamburger menu is the menu that shows up on your site on mobile view. Due to the smaller size of the device such as a mobile or a tablet, the menu changes to a collapsed version mostly viewed on mobile as ≡

If you wish this color can be changed with a simple code addition.

Here’s how you can change the color of the hamburger menu:

Access Dashboard > Website Builder > Custom Code
Add the below-listed code in a new line in the CSS Section of the custom code page
Click save
Open the site in incognito mode on your phone to view the change

.menubar.menubar-mobile .menubar-toggler span, .menubar.menubar-mobile .menubar-toggler span:before, .menubar.menubar-mobile .menubar-toggler span:after { background: rgb(245, 102, 238); }

Note: You will be required to change the color of the hamburger menu as per your needs. Hence, type in the RGB code of the color you want. Ensure to only change the numbers within the brackets. To get the exact RGB Code for the color you want, visit https://htmlcolorcodes.com, select the color you want, and copy the code numbers.