# Fan animation based off running status bit **URL:** \ **Category:** Ignition\ **Tags:** perspective\ **Created:** [September 17, 2026, 5:41pm UTC](https://forum.inductiveautomation.com/t/fan-animation-based-off-running-status-bit/117123 "2026-09-17T17:41:35Z")\ **Posts on this page:** 9\ **Page:** 1
**Author:** ![strickb](https://avatars.discourse-cdn.com/v4/letter/s/e8c25b/32.png) [@strickb](https://forum.inductiveautomation.com/u/strickb)\ **Post date:** [September 17, 2026, 5:41pm UTC](https://forum.inductiveautomation.com/t/fan-animation-based-off-running-status-bit/117123/1 "2026-09-17T17:41:35Z")
What is the best way to animate the fan shown below based off the status bit for running. I was looking at having the status bit change the rotate angle some how. ![FAN SPINNING BASED ON STATUS](https://us1.discourse-cdn.com/inductiveautomation/original/3X/5/8/588acb239b4674116891fdeaf76484d814ebec65.png) ---
**Author:** ![kvaneenennaam](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/kvaneenennaam/32/81819_2.png) [@kvaneenennaam](https://forum.inductiveautomation.com/u/kvaneenennaam)\ **Post date:** [September 17, 2026, 6:04pm UTC](https://forum.inductiveautomation.com/t/fan-animation-based-off-running-status-bit/117123/2 "2026-09-17T18:04:57Z")
Yes you are on the right track. Use the principles explained on this page: [Component Animation | Ignition User Manual](https://www.docs.inductiveautomation.com/docs/8.3/ignition-modules/vision/common-tasks-in-vision/component-animation) ---
**Author:** ![strickb](https://avatars.discourse-cdn.com/v4/letter/s/e8c25b/32.png) [@strickb](https://forum.inductiveautomation.com/u/strickb)\ **Post date:** [September 17, 2026, 6:11pm UTC](https://forum.inductiveautomation.com/t/fan-animation-based-off-running-status-bit/117123/3 "2026-09-17T18:11:44Z")
Looks like that document is for Vision. i am trying to animate this fan is perspective ---
**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:** [September 17, 2026, 6:12pm UTC](https://forum.inductiveautomation.com/t/fan-animation-based-off-running-status-bit/117123/4 "2026-09-17T18:12:59Z")
The correct answer is that you really should not. Animating a normal process is considered a distraction, according to ISA-101. This may give you some insights. [What Is High-Performance HMI? - RealPars](https://www.realpars.com/blog/high-performance-hmi) ---
**Author:** ![lrose](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/lrose/32/62724_2.png) [@lrose](https://forum.inductiveautomation.com/u/lrose)\ **Post date:** [September 17, 2026, 6:13pm UTC](https://forum.inductiveautomation.com/t/fan-animation-based-off-running-status-bit/117123/5 "2026-09-17T18:13:04Z")
You can do quite a bit with SVG's if you know how to make it happen. > [@How to add animation by HTML/CSS scripts in Perspective?](https://forum.inductiveautomation.com/t/how-to-add-animation-by-html-css-scripts-in-perspective/75523/14): > > Okay, so it took me longer than I wanted (my laptop died), but I finally did get around to completing this, and I have to say I'm pretty pleased with the result. This was a fun exercise and I learned something good along the way. I will give you a disclaimer though, other than a rough idea of what an Azimuth Propeller is, I don't know much else. So for instance, I have no idea what the yellow triangle is supposed to indicate and so I didn't add it. I made some assumptions on how I think the re… Personally though, I would caution you against this. Is rotating the fan really needed to show that the fan is running? I think changing the color and text of the label is more than enough to indicate the status. To each their own though. If I had to do this, I would get an SVG and animate it similar to the link above illustrates. ---
**Author:** ![strickb](https://avatars.discourse-cdn.com/v4/letter/s/e8c25b/32.png) [@strickb](https://forum.inductiveautomation.com/u/strickb)\ **Post date:** [September 17, 2026, 6:15pm UTC](https://forum.inductiveautomation.com/t/fan-animation-based-off-running-status-bit/117123/6 "2026-09-17T18:15:45Z")
This is being displayed in the engineering dept. so not gonna be a distraction to the operator. The display in the engineering dept is more for show so more moving components seem to impress the visitors more ---
**Author:** ![dkhayes117](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/dkhayes117/32/68344_2.png) [@dkhayes117](https://forum.inductiveautomation.com/u/dkhayes117)\ **Post date:** [September 17, 2026, 6:34pm UTC](https://forum.inductiveautomation.com/t/fan-animation-based-off-running-status-bit/117123/7 "2026-09-17T18:34:38Z")
In the advanced stylesheet, make the following entry, ```css @keyframes spinner { 0% {rotate: 0deg;} 100% {rotate: 360deg;} } .psc-Rotations\/Fan{ animation: spinner 2s linear infinite; transform-origin: 50%; } ``` Create a blank style class with the path `Rotations/Fan`. Under the `Group_Impeller_Blades` group, add the `style` prop, and set the style class to `Rotations/Fan`. ---
**Author:** ![Felipe\_CRM](https://avatars.discourse-cdn.com/v4/letter/f/dfb087/32.png) [@Felipe\_CRM](https://forum.inductiveautomation.com/u/Felipe_CRM)\ **Post date:** [September 17, 2026, 6:36pm UTC](https://forum.inductiveautomation.com/t/fan-animation-based-off-running-status-bit/117123/8 "2026-09-17T18:36:17Z")
dkhayes beat me to the animation part, but to actually control the animation, you can use the status bit in a binding to assign the CSS class to the fan: ```python if({this.custom.running},"Rotations/Fan", "") ``` ---
**Author:** ![strickb](https://avatars.discourse-cdn.com/v4/letter/s/e8c25b/32.png) [@strickb](https://forum.inductiveautomation.com/u/strickb)\ **Post date:** [September 17, 2026, 6:40pm UTC](https://forum.inductiveautomation.com/t/fan-animation-based-off-running-status-bit/117123/9 "2026-09-17T18:40:35Z")
Thanks guys for the help. Just tried it and it works.