# Multiple styles in custom SVG

**URL:** <https://forum.inductiveautomation.com/t/multiple-styles-in-custom-svg/47656>\
**Category:** Ignition\
**Tags:** perspective, ignition81\
**Created:** [June 10, 2021, 4:07pm UTC](https://forum.inductiveautomation.com/t/multiple-styles-in-custom-svg/47656 "2021-06-10T16:07:02Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![jcoghlin](https://avatars.discourse-cdn.com/v4/letter/j/ac8455/32.png) [@jcoghlin](https://forum.inductiveautomation.com/u/jcoghlin)\
**Post date:** [June 10, 2021, 4:07pm UTC](https://forum.inductiveautomation.com/t/multiple-styles-in-custom-svg/47656/1 "2021-06-10T16:07:03Z")

</div>

I have a custom SVG file with three different icons I would like to add.

 ![Capture](https://us1.discourse-cdn.com/inductiveautomation/original/3X/d/5/d5f76a2e1cd8114e27d213760249cad0a88db5d1.png) Is there any way I can have different styles for each of my icons? Currently, the second two icons use the same style when they are both on the screen. Thanks.

---

<div class="post-metadata">

**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\
**Post date:** [June 10, 2021, 7:27pm UTC](https://forum.inductiveautomation.com/t/multiple-styles-in-custom-svg/47656/2 "2021-06-10T19:27:23Z")

</div>

the file you show seems like the 3 svg already have diffrent styles, what exactly is not working here?  
tho it seems in the thrid one you are overwriting the style of the second one, there should probably be a different name for cls1 class.  
im also not sure if you need the things here

---

<div class="post-metadata">

**Author:** ![jcoghlin](https://avatars.discourse-cdn.com/v4/letter/j/ac8455/32.png) [@jcoghlin](https://forum.inductiveautomation.com/u/jcoghlin)\
**Post date:** [June 10, 2021, 8:48pm UTC](https://forum.inductiveautomation.com/t/multiple-styles-in-custom-svg/47656/3 "2021-06-10T20:48:41Z")

</div>

You’re right. The problem was that the first style was being overwritten by the second. Changing cls1 worked! Thanks!

---

<div class="post-metadata">

**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\
**Post date:** [June 11, 2021, 1:53pm UTC](https://forum.inductiveautomation.com/t/multiple-styles-in-custom-svg/47656/4 "2021-06-11T13:53:20Z")

</div>

No problem,  
Could you mark the solution so that it appears solved. So the forum and others dont need to check it again.