# Colour animation from expression

**URL:** <https://forum.inductiveautomation.com/t/colour-animation-from-expression/49192>\
**Category:** Ignition\
**Created:** [July 26, 2021, 1:42pm UTC](https://forum.inductiveautomation.com/t/colour-animation-from-expression/49192 "2021-07-26T13:42:46Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![joelle.rennick](https://avatars.discourse-cdn.com/v4/letter/j/8edcca/32.png) [@joelle.rennick](https://forum.inductiveautomation.com/u/joelle.rennick)\
**Post date:** [July 26, 2021, 1:42pm UTC](https://forum.inductiveautomation.com/t/colour-animation-from-expression/49192/1 "2021-07-26T13:42:46Z")

</div>

Hello! I am wondering what the best way to create colour animations based on an expression are. For example,

```auto
if ({[.]DIVERTER_STATE/0} , 0,
	if ({[.]DIVERTER_STATE/5} , 1,
		if (({[.]DIVERTER_STATE/11}||{[.]DIVERTER_STATE/12}||{[.]DIVERTER_STATE/13}||{[.]DIVERTER_STATE/14}) , 2,
			if ({[.]DIVERTER_STATE/4} , 3, 4
			)
		)
	)
)

```

I have this expression where {[.]DIVERTER\_STATE/#} is the tag path. For each number value, I would like to make it turn a different colour and some of them blink between colours. Does anyone know if this is possible or if I will have to make another tag which has this expression in it and then bind the colour to that tag?  
Thanks!

---

<div class="post-metadata">

**Author:** ![JordanCClark](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jordancclark/32/83362_2.png) [@JordanCClark](https://forum.inductiveautomation.com/u/JordanCClark)\
**Post date:** [July 26, 2021, 2:04pm UTC](https://forum.inductiveautomation.com/t/colour-animation-from-expression/49192/2 "2021-07-26T14:04:46Z")

</div>

I would use [binEnc](https://docs.inductiveautomation.com/display/DOC81/binEnc) to make a single value. Then use the [Style Customizer](https://docs.inductiveautomation.com/display/DOC81/Color+Animation+in+Vision) (about a third of the way down the page) to drive the colors.

---

<div class="post-metadata">

**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\
**Post date:** [July 26, 2021, 2:36pm UTC](https://forum.inductiveautomation.com/t/colour-animation-from-expression/49192/3 "2021-07-26T14:36:59Z")

</div>

> [@JordanCClark](#):
>
> Then use the [Style Customizer](https://docs.inductiveautomation.com/display/DOC81/Color+Animation+in+Vision)

Assuming this is Vision, I actually stay away from the style customiser for colours as they then become magic colours - colours that are once off's with no link back to a variable or constant. For Vision, I use a collection of colours defined with client tags, unfortunately using RGB colour model (as opposed to HSL which is human-readable as Vision can't interpret HSL). I reference these style tags in expressions

---

<div class="post-metadata">

**Author:** ![JordanCClark](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jordancclark/32/83362_2.png) [@JordanCClark](https://forum.inductiveautomation.com/u/JordanCClark)\
**Post date:** [July 26, 2021, 3:46pm UTC](https://forum.inductiveautomation.com/t/colour-animation-from-expression/49192/4 "2021-07-26T15:46:15Z")

</div>

You can always bind the styles dataset to tags… 😜

---

<div class="post-metadata">

**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\
**Post date:** [July 26, 2021, 9:33pm UTC](https://forum.inductiveautomation.com/t/colour-animation-from-expression/49192/5 "2021-07-26T21:33:38Z")

</div>

Oh yeah… \*penny drop\* that would be smart 🙄 oh dear…

---

<div class="post-metadata">

**Author:** ![amarks](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/amarks/32/45610_2.png) [@amarks](https://forum.inductiveautomation.com/u/amarks)\
**Post date:** [November 7, 2022, 9:18pm UTC](https://forum.inductiveautomation.com/t/colour-animation-from-expression/49192/6 "2022-11-07T21:18:37Z")

</div>

You can also do cell-update bindings to get your tags into the styles from the customizer