How to change table cell colors based on record values

[boli199825]

Hello,

I am trying to alter the colors within a cell on a module table based on the values on that cell. (if the value in the cell shows 5 it turns green, if it is 10 it turns red). In what ways am I able to achieve this? I see methods like GlideRecord to get the data but how do I use that data to determine which cell it's at and recolor said cell in the table upon loading it in ServiceNow.

Cheers,

[sachinvic · Accepted solution]

Hi,

You don't need to use GlideRecord just to identify the cell currently being rendered. The approach depends on how the module table is implemented.

If this is a standard ServiceNow list, check Configure > List Layout and the available field-style configuration. You can define styles based on field values where supported.

For a standard Platform UI list:

Navigation

All >> System UI >> Field Styles

Example configuration

FieldValue

Table	Target table
Field name	Target field
Value	5
Style	background-color: green; color: white;

Create a second style record with Value 10 and red background.

FYR: https://www.servicenow.com/docs/r/platform-administration/t_DefineFieldStyles.html

If this is a custom Fluent UI table, retrieve the record values and apply conditional CSS styling in the cell-rendering logic. For example, check the cell value and assign a green background for 5 and red for 10.

Could you confirm whether this is a standard platform list or a custom table developed using Fluent UI? The implementation will differ.

NOTE: GlideRecord retrieves server-side records; it does not identify or style rendered browser cells by itself. The exact implementation depends on the UI being used.

Helpful? Please mark the response as Accepted Solution and close the thread — this helps future readers find the solution faster.

Regards,
Sachinvic
ArchX Certified | 16x ServiceNow AI MVP

[boli199825]

This was a table that was created in System Definition with its data populated via a local excel spreadsheet. Also I used the Field Style method and it worked pretty well! The red one however has a slightly more complicated condition where not only does the value have to be 10 but the value of a different column on the same row must have a Price exceeding 50000$. I know in field style value I would put 10 but is there a way to check the other column for the price?

[BrianS344076034]

you should be able to do this with field styles
Create a new field style

table - your table

Field name - the field you are using

Value - 5

Style - CSS - background-color: green;

repeat for Red

Value - 10

Style - CSS - background-color: red;