# Add transparency to built in theme color

**URL:** <https://forum.inductiveautomation.com/t/add-transparency-to-built-in-theme-color/65594>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [October 24, 2022, 1:18pm UTC](https://forum.inductiveautomation.com/t/add-transparency-to-built-in-theme-color/65594 "2022-10-24T13:18:38Z")\
**Posts on this page:** 1\
**Showing post:** 3

<div class="post-metadata">

**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\
**Post date:** [October 24, 2022, 3:10pm UTC](https://forum.inductiveautomation.com/t/add-transparency-to-built-in-theme-color/65594/3 "2022-10-24T15:10:54Z")

</div>

When you supply a theme color to a property, you're supplying a string name, and handing off handling of conversion to the browser in use, where the string name will eventually match a variable name and be converted into a hex value.

But in the Designer, any binding will only see the string value - there is no direct check ever made against the CSS files by Ignition because they're "downstream" of Ignition itself.

Oddly enough, there's no way to directly add alpha to a variable in CSS, but you can get the desired behavior by modify the `opacity` property of the component in question.

 ![Screen Shot 2022-10-24 at 8.10.33 AM](https://us1.discourse-cdn.com/inductiveautomation/original/3X/c/0/c0d74192e014d91a64874b38bc490f2ec5679924.png)

---

_[View the full topic](https://forum.inductiveautomation.com/t/add-transparency-to-built-in-theme-color/65594)._
