How to change the background color of navigation bar?

LinhN · ‎11-14-2024

Hi there,

I want to change the background color of the navigation bar. Does anyone here know how to do this? Please help me find a solution

Ashish Parab · ‎11-15-2024

Hey @LinhN ,

Please create a UI script as below:

(function() {
    addAfterPageLoadedEvent(function() {

        var backgroundColor = '#FFFF00'; // give value of your color
        $$('.navbar').each(function(elmt) {
            elmt.style.backgroundColor = backgroundColor;
        });

    });
})();

Output-

Please mark this as "correct" and "helpful" if you feel this answer helped you in anyway.

Thanks and Regards,

Ashish

View solution in original post

Rohit99 · ‎11-14-2024

Hi @LinhN,

Here’s a link you might find helpful—please take a look : How to Change the Header's Background Color in New ServiceNow UI

Please mark my response as correct and helpful if it helped solved your question.

Thanks,

Rohit Suryawanshi

Satoshi Abe · ‎11-14-2024

@LinhN

I think you'd like to change Core UI. Please see the following document.

https://www.servicenow.com/docs/bundle/xanadu-platform-user-interface/page/administer/navigation-and...

1.Navigate to All > System Properties > Basic Configuration UI16.
2.Complete the configuration by changing any of the following settings:(see above URL)

LinhN · ‎11-14-2024

Hi, I have tried this way but it is changing the color of the top banner page. I mean I want to change the color of the navigation bar from Grey to another color. Could you help me how can I modify this?

SN_Learn · ‎11-15-2024

Hi @LinhN ,

Please try the below:

{
  "base": {
    "--now-color_surface--neutral-3": "0, 255, 255"
  }
}

Results:

----------------------------------------------------------------
Mark this as Helpful / Accept the Solution if this helps.