Color code a column in a table based on its value

Hi All

I have a retool table with Au_ppm column in it. I want this column to be color coded based on the Au_ppm value.
I tried to use tag but I am not sure how to use the range. For example, I want to make the cell color RED when the Au_ppm value is >5 ppm, and then orange if the value is between 3-5 ppm.
I can do it in excel but I want to integrate this in my retool app.

Is there anyone can help?


This is my table

This is the example (Excel table)

@Dhani This can be done but it is not yet possible with the new table component. I think there is a fix to be released soon.
When the fix is ready; you should use a ternary operator in the Au_ppm column for Background field like so:
{{self >5 ?'red':self >= 3 && self <= 5 ?'orange':''}}
Try it now any way


@Dhani It seems like this is ready to rock and roll:


Your Conditionals Will Vary :smiley:


Thanks Guys

I tried to use this simple code: {{self >0.5 ? 'red' : 'yellow'}}, in the new table it didn't work. It shows only all yellow.
But it works with the legacy table. Hmm...maybe I just wait for this to be fixed?

Thanks for all your helps


Hello, self in new table is point to table itself. I try item is ok. but still with error tooltip.
pls help to fix this wrong tooltip, we can get item in the background option's scope.

Ah cool, it works with item instead of self.
Thanks for this. The tooltip shows error but I think the code is working.

Interesting stuf!! Thanks @ScottR :+1:

1 Like

Yes this does work, but interestingly the Retool linter is showing me that item does not exist.


Yes, despite error tooltip, but it can work. The error tooltip should be remove, I have reported that in another topic.

1 Like

@Dhani @bradlymathews @AnsonHwang I mentioned over here as well, circling back to let you know that incorrect tooltip error was fixed and released Aug 4th! :white_check_mark: Thanks for all your comments above making sure this at least functionally worked in the meantime