Avada Forums Community Forum Unable to Override CSS Variables

Tagged: ,

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • RadNet
    Post count: 2

    I seem to be unable to override a CSS rule to change the color of the mobile menu icon (hamburger icon). The default Avada styles are controlling it with the Options > Mobile Menu settings value, but I need to change it because my homepage is using a different background color and the value for it in the Options does not work.

    (I do not see any of the CSS Variable controls in the Performance tab I am seeing information about in official Documentation either).

    So the CSS set by Avada Options is:

    .fusion-mobile-menu-icons a {
        color: var(--mobile_menu_toggle_color);

    And I am using:

    .fusion-mobile-menu-icons a {
        color: #ffffff!important;

    Page can be found here:

    I am running Avada 7.7.1.

    Thanks in advance for any insight from the community.


    Ammar. S
    Post count: 2253

    Hello There

    You should actually not be needing CSS for this, please simply use custom header and add the color from menu element itself there, however if you still want to use custom CSS for some reasons, kindly try this CSS instead.

    .fusion-mobile-menu-icons a:before{color: green !important;}

    If you need any further assistance, please know that you have a valid support with us and should be able to open a support ticket without any issues.

    Click Here to Get Avada Support


Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.