# Error: Unable to convert "White" to float4 if passed as Observable value 

**URL:** <https://forums.fusetools.com/t/error-unable-to-convert-white-to-float4-if-passed-as-observable-value/3570>\
**Category:** How-to Discussions\
**Created:** [August 15, 2016, 10:14am UTC](https://forums.fusetools.com/t/error-unable-to-convert-white-to-float4-if-passed-as-observable-value/3570 "2016-08-15T10:14:03Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Mojo](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/mojo/32/167_2.png) [@Mojo](https://forums.fusetools.com/u/Mojo)\
**Post date:** [August 15, 2016, 10:14am UTC](https://forums.fusetools.com/t/error-unable-to-convert-white-to-float4-if-passed-as-observable-value/3570/1 "2016-08-15T10:14:03Z")

</div>

This works…

```auto
    <Text Color="White">My Text </Text>

```

If I make it the color property a variable

```auto
    <Text Color="{targetColor}">My Text </Text>

```

Setting the Color via String throws the error:

```auto
var targetColor = Observable("White")

```

= ERROR

Setting the Color via #hex value works

```auto
var targetColor = Observable("#FFF")

```

= OK

What am I missing here?

PS I tried setting a global pallete value

```auto
        <Panel ux:Class="ColorPalette">
            <float4 ux:Global="White" ux:Value="#FFF" />
        </Panel>

```

and that still doesn’t work…

---

<div class="post-metadata">

**Author:** ![Remi\_Pedersen](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/remi_pedersen/32/432_2.png) [@Remi\_Pedersen](https://forums.fusetools.com/u/Remi_Pedersen)\
**Post date:** [August 15, 2016, 10:22am UTC](https://forums.fusetools.com/t/error-unable-to-convert-white-to-float4-if-passed-as-observable-value/3570/2 "2016-08-15T10:22:06Z")

</div>

It’s a bit unclear whether setting the observable via hex works for you or not. You say it works, but then also ERROR? Ref:

> Setting the Color via #hex value works var targetColor = Observable(“#FFF”) = ERROR

Anyway, I would expect that setting the hex values from javascript works, whereas trying to use “White” in javascript won’t work because it’s not defined anywhere in the JavaScript context.

---

<div class="post-metadata">

**Author:** ![Mojo](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/mojo/32/167_2.png) [@Mojo](https://forums.fusetools.com/u/Mojo)\
**Post date:** [August 15, 2016, 11:02am UTC](https://forums.fusetools.com/t/error-unable-to-convert-white-to-float4-if-passed-as-observable-value/3570/3 "2016-08-15T11:02:24Z")

</div>

> **Remi Pedersen wrote:**
> 
> It’s a bit unclear whether setting the observable via hex works for you or not. You say it works, but then also ERROR? Ref:
> 
> > Setting the Color via #hex value works var targetColor = Observable(“#FFF”) = ERROR
> 
> Anyway, I would expect that setting the hex values from javascript works, whereas trying to use “White” in javascript won’t work because it’s not defined anywhere in the JavaScript context.

Hi Remi. First of all, my apologies for the confusion. I actually corrected my post.

So to confirm, setting the Color via #hex value works

```uno
 var targetColor = Observable("#FFF");// This Works 

```

Now, I understand what you mean about JS “White” not being defined anywhere in the JS Context, but I don’t think this is the case. I am merely passing the string “White” into the Color declaration.

```uno
var targetColor = Observable("White");// White=String not Variable

```

so this…

```ux
<Text Color="{targetColor}">My Text </Text>

```

…should be equal to this…

```ux
<Text Color="White">My Text </Text>

```

… is it not?

---

<div class="post-metadata">

**Author:** ![Remi\_Pedersen](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/remi_pedersen/32/432_2.png) [@Remi\_Pedersen](https://forums.fusetools.com/u/Remi_Pedersen)\
**Post date:** [August 15, 2016, 1:08pm UTC](https://forums.fusetools.com/t/error-unable-to-convert-white-to-float4-if-passed-as-observable-value/3570/4 "2016-08-15T13:08:58Z")

</div>

Not really. 🙂 Without being an expert I’d say that it’s very likely that setting a property to a constant struct (which is what `White` is a helper-alias for here) behaves differently than binding it to an observable in JavaScript.

Either way, if you want to be able to use convenience-aliases (“text names”) for colors in javascript then you should define them there. 🙂 (After all, defining them on your own also means you’ll know which RGB colors they _actuall_ represent).

---

<div class="post-metadata">

**Author:** ![Mojo](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/mojo/32/167_2.png) [@Mojo](https://forums.fusetools.com/u/Mojo)\
**Post date:** [August 16, 2016, 12:53am UTC](https://forums.fusetools.com/t/error-unable-to-convert-white-to-float4-if-passed-as-observable-value/3570/5 "2016-08-16T00:53:19Z")

</div>

> **Remi Pedersen wrote:**
> 
> Not really. 🙂 Without being an expert I’d say that it’s very likely that setting a property to a constant struct (which is what `White` is a helper-alias for here) behaves differently than binding it to an observable in JavaScript.
> 
> Either way, if you want to be able to use convenience-aliases (“text names”) for colors in javascript then you should define them there. 🙂 (After all, defining them on your own also means you’ll know which RGB colors they _actuall_ represent).

Ohh…OK. I guess I’m thinking of this in a very plain Variable=Value representation which I guess is wrong in the get go.

Anyway, it’s no biggie I don’t mind doing RGB, I was just trying to understand the situation.

Thanks!