Tab Background Graphic in Polaris

[Lukas Loehrer]

In all of the Tabs that can be expanded from the top like the "All" and "Favorites" tab, there's a transparent graphic at the bottom (like the background of .sn-polaris-nav::before). How can I remove this? It look hideous if you use any color other than the default.

[sachin_namjoshi]

You will have to update CSS in UX theme for polaris.

Take a look into below useful article

https://community.servicenow.com/community?id=community_article&sys_id=a33fb397db590110e515c22305961936

Regards,

Sachin

[Ashley Snyder]

This article assists in theming Next Experience UI, but does not provide information on removing the OOTB graphics. Darker colors do work better, and if you use the Color Generator provided in that article posted above (https://community.servicenow.com/community?id=community_article&sys_id=a33fb397db590110e515c22305961...) you will get the variables used in Next Experience which makes theming easier, I've noticed darker colors look better with that graphic.

I don't believe this graphic is able to be removed, as the app shell for Next Experience is not editable. You can put an Idea in the Idea Portal to have the ability to change this: https://community.servicenow.com/community?id=ideas_list&sysparm_module_id=enhancement_requests

[Ashley Snyder · Accepted solution]

Just learned via the SNDevs Slack (thanks Eric Riemer) than you can "remove" the image via setting the opacity on the following CSS Variable:  --now-unified-nav_menu--background-image-alpha. The image will not be removed but it will no longer display due to the opacity settings.

[Eivind Sandnes]

Hi,

I can't seem to get it to work, do you have the syntax for this?