# Perspective Css-Theme-Variable not working on all Controls

**URL:** <https://forum.inductiveautomation.com/t/perspective-css-theme-variable-not-working-on-all-controls/66629>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [November 17, 2022, 12:09pm UTC](https://forum.inductiveautomation.com/t/perspective-css-theme-variable-not-working-on-all-controls/66629 "2022-11-17T12:09:22Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![roland.scheuer](https://avatars.discourse-cdn.com/v4/letter/r/c57346/32.png) [@roland.scheuer](https://forum.inductiveautomation.com/u/roland.scheuer)\
**Post date:** [November 17, 2022, 12:09pm UTC](https://forum.inductiveautomation.com/t/perspective-css-theme-variable-not-working-on-all-controls/66629/1 "2022-11-17T12:09:22Z")

</div>

Hi,

im trying to set the color of a Gauge control with a theme variable but it seems it s not working.

-\> [Perspective Built-In Themes - Ignition User Manual 8.1 - Ignition Documentation](https://docs.inductiveautomation.com/display/DOC81/Perspective+Built-In+Themes)

Im using Ignition 8.1.20

Any hints to make it work, or its by design, or im completly wrong 🙂

Thanks in advance.

br,  
Roland  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/a/7/a7f34e58c837b5ba99499279468ce166cbb6a5b0.png)  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/d/1/d14b2c37c12c344ed087e58979a3b9108648dc5d.png)

---

<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 17, 2022, 3:19pm UTC](https://forum.inductiveautomation.com/t/perspective-css-theme-variable-not-working-on-all-controls/66629/2 "2022-11-17T15:19:15Z")

</div>

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](https://us1.discourse-cdn.com/inductiveautomation/original/3X/1/4/14a77e778b0f85980492fb10bf372e16db437256.png)

I used the ColorZilla plugin for Google Chrome to read/pick the colors from the Ignition manual page and pasted them into the bindings as follows:

```auto
if(left({this.props.theme}, 4) = 'dark', '#fafafa', '#222222')

```

Now all you have to do is make sure that any dark themes start with 'dark' and it should work. Obviously you can add in as many other theme items as required.

Your chart components now use property bindings to these variables instead of the `--theme-color` syntax. It's a bit of a hack but it gives you a decent chance of consistent color through a project.