# Tree component; how to change the hover color?

**URL:** <https://forum.inductiveautomation.com/t/tree-component-how-to-change-the-hover-color/40996>\
**Category:** Ignition\
**Tags:** perspective, ignition81\
**Created:** [November 26, 2020, 8:44pm UTC](https://forum.inductiveautomation.com/t/tree-component-how-to-change-the-hover-color/40996 "2020-11-26T20:44:08Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![code\_skin](https://avatars.discourse-cdn.com/v4/letter/c/43a26b/32.png) [@code\_skin](https://forum.inductiveautomation.com/u/code_skin)\
**Post date:** [November 26, 2020, 8:44pm UTC](https://forum.inductiveautomation.com/t/tree-component-how-to-change-the-hover-color/40996/1 "2020-11-26T20:44:08Z")

</div>

When I hover over this component it’s hard to read the text. How do I change the color of the hover?

[https://us1.discourse-cdn.com/inductiveautomation/original/3X/4/f/4fe1f50943fb1c47acf82d6df50279101d2e1aaf.mp4](https://us1.discourse-cdn.com/inductiveautomation/original/3X/4/f/4fe1f50943fb1c47acf82d6df50279101d2e1aaf.mp4)

I tried creating a style that utilizes the hover element state but that renders the entire component. I’m just looking to change the hover color on the individual items. Please show me the light.

---

<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:** [November 27, 2020, 2:37am UTC](https://forum.inductiveautomation.com/t/tree-component-how-to-change-the-hover-color/40996/2 "2020-11-27T02:37:46Z")

</div>

Pretty sure you ll need to override the styling in the theme css for this. It’ll be somewhere in the ‘palletes’ folder in the theme I believe, look for the tree component in there something like ia-treexxxx

---

<div class="post-metadata">

**Author:** ![code\_skin](https://avatars.discourse-cdn.com/v4/letter/c/43a26b/32.png) [@code\_skin](https://forum.inductiveautomation.com/u/code_skin)\
**Post date:** [November 27, 2020, 1:28pm UTC](https://forum.inductiveautomation.com/t/tree-component-how-to-change-the-hover-color/40996/3 "2020-11-27T13:28:01Z")

</div>

The manual has the following caution note:

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

Does this mean only the light.css, dark.css files are replaced or does it mean all the \*.css in the sub folders as well?

---

<div class="post-metadata">

**Author:** ![pturmel](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pturmel/32/3295_2.png) [@pturmel](https://forum.inductiveautomation.com/u/pturmel)\
**Post date:** [November 27, 2020, 1:39pm UTC](https://forum.inductiveautomation.com/t/tree-component-how-to-change-the-hover-color/40996/4 "2020-11-27T13:39:19Z")

</div>

Did you read the markdown-formatted README file? It explains it pretty definitively. (Those two subfolders _ **will** _ be reset.)

---

<div class="post-metadata">

**Author:** ![code\_skin](https://avatars.discourse-cdn.com/v4/letter/c/43a26b/32.png) [@code\_skin](https://forum.inductiveautomation.com/u/code_skin)\
**Post date:** [November 27, 2020, 1:44pm UTC](https://forum.inductiveautomation.com/t/tree-component-how-to-change-the-hover-color/40996/5 "2020-11-27T13:44:50Z")

</div>

Admittedly, I skimmed through the document. Makes sense now.

---

<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:** [November 27, 2020, 8:56pm UTC](https://forum.inductiveautomation.com/t/tree-component-how-to-change-the-hover-color/40996/6 "2020-11-27T20:56:24Z")

</div>

You’ll need to make a new theme which the readme guides you through. You can also just look at one of the other themes (not light as that’s the base theme) and basically copy those and strip most of their content out
