Skip to page contentSkip to chat
ServiceNow support
    • Community
      Ask questions, give advice, and connect with fellow ServiceNow professionals.
      Developer
      Build, test, and deploy applications
      Documentation
      Find detailed information about ServiceNow products, apps, features, and releases.
      Impact
      Accelerate ROI and amplify your expertise.
      Learning
      Build skills with instructor-led and online training.
      Partner
      Grow your business with promotions, news, and marketing tools
      ServiceNow
      Learn about ServiceNow products & solutions.
      Store
      Download certified apps and integrations that complement ServiceNow.
      Support
      Manage your instances, access self-help, and get technical support.
Service Portal header does not show the same color in the ServiceNow mobile app - Support and Troubleshooting
  • >
  • Knowledge Base
  • >
  • Support and Troubleshooting (Knowledge Base)
  • >
  • Service Portal header does not show the same color in the ServiceNow mobile app
KB0713587

Service Portal header does not show the same color in the ServiceNow mobile app


1985 Views Last updated : May 29, 2025 public Copy Permalink
KB Summary by Now Assist

Issue

After customizing the Service Portal's header either through the sp_header_footer record or via the Service Portal branding editor, the Service Portal header may not show the expected changes when viewed through the mobile app.

Customized header in Service Portal mobile app

 

 

Release

All releases of ServiceNow Mobile App

Cause

There is a separate CSS specifically for the navigation bar when viewed through the mobile app.

/* for mobile app */

.navbar-inverse.is-native {

  background-color: #405060;

}

Resolution

To solve this, make sure that the CSS for the navigation bar on the mobile app is also configured, which can be done via the following steps:

  1. Navigate to the header record for the Portal. A list can be found at: https://<your-instance>.service-now.com/sp_header_footer_list.do
  2. Once you have the appropriate header record opened, locate the CSS field.
  3. In the CSS field, locate the following code:

    /* for mobile app */

    .navbar-inverse.is-native {

      background-color: #405060;

    }
  4. Edit the background-color to the desired color
  5. Save.

 


The world works with ServiceNow.

Sign in for more! There's more content available only to authenticated users Sign in for more!
Did this KB article help you?
Did this KB article help you?

How would you rate your Now Support digital experience?

*

Very unsatisfied

Unsatisfied

Neutral

Satisfied

Very satisfied

Very unsatisfied

Unsatisfied

Neutral

Satisfied

Very satisfied

What can we improve? Please select all that apply.

What are we doing well? Please select all that apply.

Tell us more

*

Do you expect a response from this feedback?

  • Terms and conditions
  • Privacy statement
  • GDPR
  • Cookie policy
  • © 2025 ServiceNow. All rights reserved.