# Perspective Menu Tree icon color not changing during Hover

**URL:** <https://forum.inductiveautomation.com/t/perspective-menu-tree-icon-color-not-changing-during-hover/95173>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [August 26, 2024, 8:21pm UTC](https://forum.inductiveautomation.com/t/perspective-menu-tree-icon-color-not-changing-during-hover/95173 "2024-08-26T20:21:38Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Panko](https://avatars.discourse-cdn.com/v4/letter/p/c5a1d2/32.png) [@Panko](https://forum.inductiveautomation.com/u/Panko)\
**Post date:** [August 26, 2024, 8:21pm UTC](https://forum.inductiveautomation.com/t/perspective-menu-tree-icon-color-not-changing-during-hover/95173/1 "2024-08-26T20:21:39Z")

</div>

I'm trying to build a Menu Tree that will change color on Hover event and I have this part resolved without a problem. The issue is that I want to change the color of my menu item icons to match the text of the item without hovering over the icon specifically.

Mouse hovering on menu item

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/f/8/f8988ef45eaf5e8dca9f91a9de8baf67c2f3385d.png)

Mouse hovering on icon of menu item

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/3/e/3ed6b987e20f41e4c3253efde11ed0ec0467c7a7.png)

What should I be binding the navIcon and icon color values to in order for them to match the color of the item text while hovering?

---

<div class="post-metadata">

**Author:** ![Kevin\_Tulloch](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/kevin_tulloch/32/39631_2.png) [@Kevin\_Tulloch](https://forum.inductiveautomation.com/u/Kevin_Tulloch)\
**Post date:** [August 26, 2024, 11:49pm UTC](https://forum.inductiveautomation.com/t/perspective-menu-tree-icon-color-not-changing-during-hover/95173/2 "2024-08-26T23:49:23Z")

</div>

I was able to achieve this using the [advanced stylesheet](https://docs.inductiveautomation.com/docs/8.1/ignition-modules/perspective/styles/style-classes#enabling-the-advanced-stylesheet) by providing it with this CSS text:

```python
.ia_menuTreeComponent__item:hover {
	color: red;
	fill: red;
}

.ia_menuTreeComponent __item__ navIcon {
	fill: inherit;
}

.ia_menuTreeComponent __item__ icon, .ia_menuTreeComponent __header__ icon {
	fill: inherit;
}

```

---

<div class="post-metadata">

**Author:** ![Panko](https://avatars.discourse-cdn.com/v4/letter/p/c5a1d2/32.png) [@Panko](https://forum.inductiveautomation.com/u/Panko)\
**Post date:** [August 27, 2024, 3:28pm UTC](https://forum.inductiveautomation.com/t/perspective-menu-tree-icon-color-not-changing-during-hover/95173/3 "2024-08-27T15:28:21Z")

</div>

That worked perfectly! Thank you!