When no editing has been done yet to Divi‘s mobile hamburger menu icon button, the color of it will be blue; the default color. Of course, we’d want the color to be according to what we like or to our website’s branding color! So, here’s a tutorial on how to change the color of the mobile hamburger menu, which you can do very quickly!

Sample

Before

After

Video Tutorial:

Tutorial

Step 1: Head over to Theme Customizer to add CSS

Let’s go to the Theme Customizer to add the simple CSS via WordPress dashboard > Divi > Theme Customizer > Additional CSS

Step 2: Add CSS Code & Publish

Now, we can add this code:

— — —

span.mobile_menu_bar:before {
color: #ff0000 !important;
}

— — —

If you already have some CSS codes in there, you can add this code at the top or at the bottom; the positioning doesn’t really matter as much.

The part in the code that’s bolded and in red is the hex code of the color that you would like the mobile menu hamburger icon button to be. You can find your preferred hex color code here.

And then, make sure to click the Publish button!

That’s it! Now you can enjoy the new color of the hamburger menu icon button!

If you have any questions, don’t hesitate to leave a comment, and I will do my best to help!

If you watched the tutorial video, and it helped, I am very happy that it did! Please Like, Comment & Subscribe to my YouTube channel! Thanks!