#53881 Changing Burger Icon color

Landing Forums JupiterX WordPress Theme Changing Burger Icon color

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • Gabriel

    Hi! I’m working on the site http://www.valeriagreco.com.ar

    How do I change the icon color of the burger icon menu and it’s background?

    Thanks!

    Amir Rather Support Team

    Please try the below code in Customize -> Additional CSS:

    .navbar-light .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 255, 255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E") !important;
    }
    button.jupiterx-navbar-toggler.navbar-toggler {
    border-color: rgba(0, 255, 255, 1);
    }
    
    .navbar-toggler:focus {
    outline-color: #fff !important;
    }

    PS: In order to us any color change the bold RGBA (rgba(0, 255, 255, 1)) value in above CSS

    Gabriel

    Thanks Amir, it worked perfectly 🙂

    Amir Rather Support Team

    You’re most welcome, stay home stay safe Gabriel 🙂

    Joshua

    I need the burger icon to be white #ffffff

    What needs changed in the code above to make that happen?

    Amir Rather Support Team

    Try the below CSS and let us know:

    .navbar-light .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgb(255 255 255)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E") !important;
    }
    button.jupiterx-navbar-toggler.navbar-toggler {
    border-color: rgb(255 255 255);
    }
    
    .navbar-toggler:focus {
    outline-color: #fff !important;
    }

     

     

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