# Make an image breathe and timer component? **URL:** \ **Category:** Ignition\ **Tags:** vision, perspective\ **Created:** [November 5, 2022, 2:36am UTC](https://forum.inductiveautomation.com/t/make-an-image-breathe-and-timer-component/66158 "2022-11-05T02:36:12Z")\ **Posts on this page:** 8\ **Page:** 1
**Author:** ![Juan\_Galvez](https://avatars.discourse-cdn.com/v4/letter/j/9fc348/32.png) [@Juan\_Galvez](https://forum.inductiveautomation.com/u/Juan_Galvez)\ **Post date:** [November 5, 2022, 2:36am UTC](https://forum.inductiveautomation.com/t/make-an-image-breathe-and-timer-component/66158/1 "2022-11-05T02:36:12Z")
Hi I start using perspective and vision, and with my project in perspective I already make an image to be visible when a tag value is 1, but i would like it not only to show the image when the tag is 1, i would like the image to have a breathe effect when visible, theres a way to do this ? also in vision I know that theres a timer component, someone know if theres something similar on the perspective components because i didnt find any ---
**Author:** ![jlandwerlen](https://avatars.discourse-cdn.com/v4/letter/j/bc8723/32.png) [@jlandwerlen](https://forum.inductiveautomation.com/u/jlandwerlen)\ **Post date:** [November 5, 2022, 2:53am UTC](https://forum.inductiveautomation.com/t/make-an-image-breathe-and-timer-component/66158/2 "2022-11-05T02:53:36Z")
CSS, see if one in the link is what you are after. > **[Animate.css | A cross-browser library of CSS animations.](https://animate.style/)** > > Animate.css is a library of ready-to-use, cross-browser animations for you to use in your projects. Great for emphasis, home pages, sliders, and attention-guiding hints. ---
**Author:** ![andrews](https://avatars.discourse-cdn.com/v4/letter/a/898d66/32.png) [@andrews](https://forum.inductiveautomation.com/u/andrews)\ **Post date:** [November 5, 2022, 11:11pm UTC](https://forum.inductiveautomation.com/t/make-an-image-breathe-and-timer-component/66158/3 "2022-11-05T23:11:41Z")
Do you have an example of a breathe effect? ---
**Author:** ![jlandwerlen](https://avatars.discourse-cdn.com/v4/letter/j/bc8723/32.png) [@jlandwerlen](https://forum.inductiveautomation.com/u/jlandwerlen)\ **Post date:** [November 6, 2022, 3:28pm UTC](https://forum.inductiveautomation.com/t/make-an-image-breathe-and-timer-component/66158/4 "2022-11-06T15:28:16Z")
OP probably meant pulse or heartbeat ---
**Author:** ![Juan\_Galvez](https://avatars.discourse-cdn.com/v4/letter/j/9fc348/32.png) [@Juan\_Galvez](https://forum.inductiveautomation.com/u/Juan_Galvez)\ **Post date:** [November 6, 2022, 5:37pm UTC](https://forum.inductiveautomation.com/t/make-an-image-breathe-and-timer-component/66158/5 "2022-11-06T17:37:41Z")
something like this [![](https://us1.discourse-cdn.com/inductiveautomation/original/3X/c/d/cd20eac1974781b1b1fbe6d00b25692a38ab5b4e.jpeg "This Mini LED Light Pulses and Looks Like It's Breathing!") ](https://www.youtube.com/watch?v=eOqlEYbL1zE) ---
**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\ **Post date:** [November 6, 2022, 5:47pm UTC](https://forum.inductiveautomation.com/t/make-an-image-breathe-and-timer-component/66158/6 "2022-11-06T17:47:27Z")
style classes have a animation toggle, try turning that on and playing with the settings to see if you can get what you want. ---
**Author:** ![jlandwerlen](https://avatars.discourse-cdn.com/v4/letter/j/bc8723/32.png) [@jlandwerlen](https://forum.inductiveautomation.com/u/jlandwerlen)\ **Post date:** [November 6, 2022, 8:37pm UTC](https://forum.inductiveautomation.com/t/make-an-image-breathe-and-timer-component/66158/7 "2022-11-06T20:37:30Z")
Yes, look in the link above. ---
**Author:** ![jlandwerlen](https://avatars.discourse-cdn.com/v4/letter/j/bc8723/32.png) [@jlandwerlen](https://forum.inductiveautomation.com/u/jlandwerlen)\ **Post date:** [November 6, 2022, 9:58pm UTC](https://forum.inductiveautomation.com/t/make-an-image-breathe-and-timer-component/66158/8 "2022-11-06T21:58:44Z")
Here are some examples of CSS (from [https://animate.style/](https://animate.style/)), this is using the advanced style sheet released in 8.1.22 and using a `label` component. [CSS.zip](https://forum.inductiveautomation.com/uploads/short-url/e9BZJx1DUUCRBOGPW5ZAoOSJXFO.zip) (8.7 KB) I highly recommend you read up on CSS, themes in Ignition, and styles in Ignition > **[CSS Tutorial](https://www.w3schools.com/css/)** > > W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more. [https://docs.inductiveautomation.com/display/DOC81/Perspective+Built-In+Themes](https://docs.inductiveautomation.com/display/DOC81/Perspective+Built-In+Themes) [https://docs.inductiveautomation.com/display/DOC81/Style+Classes](https://docs.inductiveautomation.com/display/DOC81/Style+Classes)