How do you change the color of the widgets background?

[Brad21]

Hi,

I'm very new at servicenow development, thank you for bearing with me. How do you change the color of the widgets background? I got the bootstrap set how i want, and i have looked using the Branding Editor. Still cannot change it, this is in my instance. thank you.

[Mark Roethof]

Here an example how you can change background things without cloning anything! Just figure out with the Chrome inspector which element it concerns, and add it to the Page Specific CSS (or Theme CSS).

If my answer helped you in any way, please then mark it as helpful.

Kind regards,
Mark

---

LinkedIn

[Mark Roethof]

Hi there,

Did this solve your question? Or do we need to follow-up on this?

Please mark this answer as correct if it solves your question. This will help others who are looking for a similar solution. Also marking this answer as correct takes the post of the unsolved list.
Thanks.

Kind regards,
Mark

---

LinkedIn

[Mark Roethof]

Hi there,

Did this solve your question? Or do we need to follow-up on this?

Please mark this answer as correct if it solves your question. This will help others who are looking for a similar solution. Also marking this answer as correct takes the post of the unsolved list.
Thanks.

Kind regards,
Mark

---

LinkedIn

[Brad21]

I figured out it is actually a button, and i needed to write script for it. thank you all for your input

[mohdaqib]

If you only need to change the background for a widget, you don’t need to clone it.

The approach depends on your requirement:

For a specific portal (e.g., if you want to change the background color only for the ESC portal), open the CSS file or navigate to the portal page, where you'll find the CSS field. Add your code there.
For all portals, open the page settings, locate the CSS field, and add the code globally.
Example
To change the background for a specific portal (ESC, CSM, etc.):
Open the sp_portal table.
Open your desired portal.
Inside the CSS variables field, add the following code:

.custom {
    background-color: #9ec16c !important;  
} 
h2, p {  
    color: black !important; 
}​

To change the background for all portals:
Open the sp_page table.
Open your desired page.
Inside the CSS variables field, add the following code:

.custom {
    background-color: #9ec16c !important;  
} 
h1, p {  
    color: black !important; 
}​

This will ensure the background color is applied correctly based on your needs.

Thank You,
Mohd Aqib
linkedin