# Trying to bind a component "background color" to a UDT tag value?

**URL:** <https://forum.inductiveautomation.com/t/trying-to-bind-a-component-background-color-to-a-udt-tag-value/86426>\
**Category:** Ignition\
**Tags:** ignition81\
**Created:** [February 27, 2024, 1:00pm UTC](https://forum.inductiveautomation.com/t/trying-to-bind-a-component-background-color-to-a-udt-tag-value/86426 "2024-02-27T13:00:55Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Gordie\_Garland1](https://avatars.discourse-cdn.com/v4/letter/g/b77776/32.png) [@Gordie\_Garland1](https://forum.inductiveautomation.com/u/Gordie_Garland1)\
**Post date:** [February 27, 2024, 1:00pm UTC](https://forum.inductiveautomation.com/t/trying-to-bind-a-component-background-color-to-a-udt-tag-value/86426/1 "2024-02-27T13:00:55Z")

</div>

Looking to do this with one GT value  
And then trying to do it with multiple GT values

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [February 27, 2024, 1:05pm UTC](https://forum.inductiveautomation.com/t/trying-to-bind-a-component-background-color-to-a-udt-tag-value/86426/2 "2024-02-27T13:05:56Z")

</div>

You need to supply more details.

- What is a "GT value"?
- What have you tried? Where are you stuck?

---

<div class="post-metadata">

**Author:** ![Gordie\_Garland1](https://avatars.discourse-cdn.com/v4/letter/g/b77776/32.png) [@Gordie\_Garland1](https://forum.inductiveautomation.com/u/Gordie_Garland1)\
**Post date:** [February 27, 2024, 2:09pm UTC](https://forum.inductiveautomation.com/t/trying-to-bind-a-component-background-color-to-a-udt-tag-value/86426/3 "2024-02-27T14:09:54Z")

</div>

when a numeric label becomes greater than an int or float value binded tag eg(10.5)  
I would like to change the background color of the numeric label

for a test I have done this so far:

Param1 = event.source.value

Param2 = system.gui.color("255,0,0")

Param1 \> 20,  
system.gui.getQuality('Numeric Label', {'background' : param2})

This has no errors, but it doesn't work.  
I believe, even though I don't have any errors, its not correct script to fire this.

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [February 27, 2024, 3:31pm UTC](https://forum.inductiveautomation.com/t/trying-to-bind-a-component-background-color-to-a-udt-tag-value/86426/4 "2024-02-27T15:31:15Z")

</div>

> [@Gordie\_Garland1](#):
>
> system.gui.color("255,0,0")

1. OK. This is Vision. You need to add the 'vision' tag to your question title.
2. You didn't answer my question. What is "GT value"? (It's important to respond to the points raised when someone offers help.)

> When a numeric label becomes greater than an int or float value binded tag eg(10.5) I would like to change the background color of the numeric label.

That's not the right approach. Try this:

- Use a Tag Binding on the label's Text property.
- Use an expression binding on the label's Background Color property. **Bind to the tag** , not the label's text. e.g.,  
`if({[default]IntMemory} > 20, color(255, 0, 0), color(0, 0, 0))`

* * *

Other comments:

> Param1 = event.source.value

You don't need an event. Tag bindings update when the tag changes.

> Param2 = system.gui.color("255,0,0")

You are passing a string to the `color(red, green, blue)` function when it needs at least three integer values. It should be `system.gui.color(255, 0, 0)`.

> Param1 \> 20,  
> system.gui.getQuality('Numeric Label', {'background' : param2})

I don't know what you are trying to achieve with this but am confident that it is not necessary.

---

<div class="post-metadata">

**Author:** ![paul-griffith](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/paul-griffith/32/37249_2.png) [@paul-griffith](https://forum.inductiveautomation.com/u/paul-griffith)\
**Post date:** [February 27, 2024, 4:03pm UTC](https://forum.inductiveautomation.com/t/trying-to-bind-a-component-background-color-to-a-udt-tag-value/86426/5 "2024-02-27T16:03:15Z")

</div>

In Vision, prefer the use of the style customizer.  
Make a custom property with the simple expression that returns true or false based on your condition.  
Then open the style customizer and make that custom property the "driving property" of your visual customization logic.  
Decoupling the two gives you more confidence your expression is correct, and makes it much easier to change styles over time.

---

<div class="post-metadata">

**Author:** ![justinedwards.jle](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/justinedwards.jle/32/37854_2.png) [@justinedwards.jle](https://forum.inductiveautomation.com/u/justinedwards.jle)\
**Post date:** [March 1, 2024, 7:35am UTC](https://forum.inductiveautomation.com/t/trying-to-bind-a-component-background-color-to-a-udt-tag-value/86426/6 "2024-03-01T07:35:29Z")

</div>

Here is a style customizer example that fits your use case:  
[https://forum.inductiveautomation.com/t/automatic-function/66619/24](https://forum.inductiveautomation.com/t/automatic-function/66619/24)