# Change value from a ux:Global

**URL:** <https://forums.fusetools.com/t/change-value-from-a-ux-global/6890>\
**Category:** General\
**Created:** [March 22, 2018, 1:29am UTC](https://forums.fusetools.com/t/change-value-from-a-ux-global/6890 "2018-03-22T01:29:34Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Samuel\_Rizzon](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/samuel_rizzon/32/759_2.png) [@Samuel\_Rizzon](https://forums.fusetools.com/u/Samuel_Rizzon)\
**Post date:** [March 22, 2018, 1:29am UTC](https://forums.fusetools.com/t/change-value-from-a-ux-global/6890/1 "2018-03-22T01:29:34Z")

</div>

Hi guys,

I am creating a button to change the colors of my app. I have two main colors that are saved in a ux: Global. How do I change this value according to the selected theme?

---

<div class="post-metadata">

**Author:** ![Arturs](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/arturs/32/582_2.png) [@Arturs](https://forums.fusetools.com/u/Arturs)\
**Post date:** [March 22, 2018, 11:49am UTC](https://forums.fusetools.com/t/change-value-from-a-ux-global/6890/2 "2018-03-22T11:49:07Z")

</div>

Hey Samuel!

You can use [`ux:Key`](https://www.fusetools.com/docs/ux-markup/resources) attribute to change `ux:Global` value.

This example should help:

```auto
<App>
    <JavaScript>
    var Observable = require("FuseJS/Observable");
    var greenTheme = Observable(false);

    module.exports = {
        greenTheme: greenTheme
    }
        
    </JavaScript>
    <float4 ux:Global="MAIN" ux:Value="#16f" />
    <WhileTrue Value="{Read greenTheme}">
        <float4 ux:Key="MAIN" ux:Value="#181" />
    </WhileTrue>
    <WhileFalse Value="{Read greenTheme}">
        <float4 ux:Key="MAIN" ux:Value="#16f" />
    </WhileFalse>
    <Panel>
        <Rectangle Color="{Resource MAIN}" Layer="Background" />
        <StackPanel>
            <Text Value="Change color" FontSize="18" Alignment="Center" Color="#fff" Padding="8" Margin="8"/>
            <Switch Value="{greenTheme}"/>
        </StackPanel>
    </Panel>
</App>

```

---

<div class="post-metadata">

**Author:** ![Samuel\_Rizzon](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/samuel_rizzon/32/759_2.png) [@Samuel\_Rizzon](https://forums.fusetools.com/u/Samuel_Rizzon)\
**Post date:** [March 22, 2018, 2:23pm UTC](https://forums.fusetools.com/t/change-value-from-a-ux-global/6890/3 "2018-03-22T14:23:48Z")

</div>

> **Arturs wrote:**
> 
> Hey Samuel!
> 
> You can use [`ux:Key`](https://www.fusetools.com/docs/ux-markup/resources) attribute to change `ux:Global` value.
> 
> This example should help:
> 
> ```auto
> <App>
> <JavaScript>
> var Observable = require("FuseJS/Observable");
> var greenTheme = Observable(false);
> 
> module.exports = {
> greenTheme: greenTheme
> }
>         
> </JavaScript>
> <float4 ux:Global="MAIN" ux:Value="#16f" />
> <WhileTrue Value="{Read greenTheme}">
> <float4 ux:Key="MAIN" ux:Value="#181" />
> </WhileTrue>
> <WhileFalse Value="{Read greenTheme}">
> <float4 ux:Key="MAIN" ux:Value="#16f" />
> </WhileFalse>
> <Panel>
> <Rectangle Color="{Resource MAIN}" Layer="Background" />
> <StackPanel>
> <Text Value="Change color" FontSize="18" Alignment="Center" Color="#fff" Padding="8" Margin="8"/>
> <Switch Value="{greenTheme}"/>
> </StackPanel>
> </Panel>
> </App>
> 
> ```

Thanks man!!! That was all I needed!