# Themes colors on Pie Charts tittles

**URL:** <https://forum.inductiveautomation.com/t/themes-colors-on-pie-charts-tittles/99227>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [November 28, 2024, 12:05pm UTC](https://forum.inductiveautomation.com/t/themes-colors-on-pie-charts-tittles/99227 "2024-11-28T12:05:30Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [November 28, 2024, 12:05pm UTC](https://forum.inductiveautomation.com/t/themes-colors-on-pie-charts-tittles/99227/1 "2024-11-28T12:05:30Z")

</div>

Hello!

I´m trying to do the whole project viewable on both dark and light themes.

For Pie Charts text the Theme Colors doesn´t work.

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/8/a/8a2232bd37e49c057a25b4e0aad31bdced37ce82.png)  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/9/e/9e4c5b74162675193f1a0ac9ce0f16f5204a89e5.png)

I tried adding some css on the styleseet.css

```python
:root {
    --neutral-10: #fafafa; 
    --neutral-90: #323232:
}

[data-theme="dark"] {
    --neutral-10: #161616; 
    --neutral-90: #21272a:
}

[data-theme="light-cool"] {
    --neutral-10: #f2f4f8;
    --neutral-90: #272525:
}

[data-theme="light-warm"] {
    --neutral-10: #f7f3f2; 
    --neutral-90: #f4f4f4:
}

[data-theme="dark-cool"] {
    --neutral-10: #121619; 
    --neutral-90: #dde1e6:
}

[data-theme="dark-warm"] {
    --neutral-10: #171414; 
    --neutral-90: #e5e0df:
}

text tspan {
    fill: var(--neutral-90); 
}

```

it works for the Pie chart text but also modify a lot of other things...

Any ideas on a workaround to do this?

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [November 28, 2024, 12:08pm UTC](https://forum.inductiveautomation.com/t/themes-colors-on-pie-charts-tittles/99227/2 "2024-11-28T12:08:28Z")

</div>

Related:

> [@Perspective Css-Theme-Variable not working on all Controls](https://forum.inductiveautomation.com/t/perspective-css-theme-variable-not-working-on-all-controls/66629/2):
>
> This is a problem with the chart components in general. They are bought in or adapted from AM Charts, for example, and may have SVG components that don't reference the CSS. We allow users to select a theme on all our projects - usually just the built-in themes. My workaround for the charts has been to set up a session.custom.config section and add the necessary colors there that mimic the CSS theme colors. [Session custom theme] I used the ColorZilla plugin for Google Chrome to read/pick the …

---

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [November 28, 2024, 12:15pm UTC](https://forum.inductiveautomation.com/t/themes-colors-on-pie-charts-tittles/99227/3 "2024-11-28T12:15:15Z")

</div>

Thanks Transistor!

---

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [January 16, 2025, 11:20am UTC](https://forum.inductiveautomation.com/t/themes-colors-on-pie-charts-tittles/99227/4 "2025-01-16T11:20:33Z")

</div>

A much simpler way is to put the background of the Pie-Chart to white

This way no matter the theme the Chart letters will always look fine.

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

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