Changing Icon Link Background Colour & Text Colour

James Veale
Giga Contributor

Hi ServiceNow Community! 

I have two questions. 

Q1:  How do I change the background colour of the below icon link beyond the options available in Bootstrap colors? 

I have read on another post that you insert the following CSS into the your widget instance but when I do this the colour does not change. Maybe I am doing something wrong when insert the code? 

a.top_icon{

  background-color: red;  

}

Q2: How do I change the text font and text colour of the text in the icon link beyond the bootstrap colours? 

 

Attached is a sample icon link. I would like to change the background colour to yellow and the text font to orange. 

 

Thanks in advance! 

James 

 

 

 

 

1 ACCEPTED SOLUTION

Harish KM
Kilo Patron
Kilo Patron

Hi James,

 

Open icon link widget, go to CSS

Add the below marked yellow

color: orange;
background-color: red;
find_real_file.png

find_real_file.png

Regards
Harish

View solution in original post

3 REPLIES 3

Harish KM
Kilo Patron
Kilo Patron

Hi James,

 

Open icon link widget, go to CSS

Add the below marked yellow

color: orange;
background-color: red;
find_real_file.png

find_real_file.png

Regards
Harish

For debugging. RIght click on widget in Portal--inspect element play around here below marked yello. FInd the id icon

find_real_file.png

Regards
Harish

Thanks Harish!