> For the complete documentation index, see [llms.txt](https://docs.overthereality.ai/over-sdk-manual/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.overthereality.ai/over-sdk-manual/over-visual-scripting-legacy/nodes/components/ui/image.md).

# Image

### Description

An Image [OverNode](/over-sdk-manual/over-visual-scripting-legacy/visual-scripting-essentials/overnode.md) is used to display a [Sprite](https://docs.unity3d.com/2018.2/Documentation/ScriptReference/Sprite.html) for the UI System, by interacting with the Unity3D [Image](https://docs.unity3d.com/2018.2/Documentation/ScriptReference/UI.Image.html) Component.

#### Image Exposer

This node is used to expose certain parameters and attributes of a given input Unity3D [Image](https://docs.unity3d.com/2018.2/Documentation/ScriptReference/UI.Image.html) Component, which are:

<table><thead><tr><th>Name</th><th width="204.3279424240331">Type</th><th width="340.1572968009442">Description</th></tr></thead><tbody><tr><td>Ref</td><td><a href="https://docs.unity3d.com/2018.2/Documentation/ScriptReference/UI.Image.html">Image</a></td><td>A reference of the input Unity3D Image Component</td></tr><tr><td>Sprite</td><td><a href="https://docs.unity3d.com/2018.2/Documentation/ScriptReference/Sprite.html">Sprite</a></td><td>The sprite that is used to render this image</td></tr><tr><td>Color</td><td>Color</td><td>Base Color of the Image</td></tr><tr><td>Fill Amount</td><td>Float</td><td>Amount of the Image shown when the Image.type is set to Image.Type.Filled</td></tr><tr><td>Material</td><td><a href="https://docs.unity3d.com/ScriptReference/Material.html">Material</a></td><td>The specified Material used by this Image. The default Material is used instead if one isn't specified</td></tr></tbody></table>

<figure><img src="/files/y7Fy74utHiJJCaf3pewB" alt=""><figcaption></figcaption></figure>

#### Set Image Material

This [OverNode](/over-sdk-manual/over-visual-scripting-legacy/visual-scripting-essentials/overnode.md) is used to modify an existing Image Component, by setting its material.

This Flow [OverNode](/over-sdk-manual/over-visual-scripting-legacy/visual-scripting-essentials/overnode.md) accepts the following input data:

<table><thead><tr><th width="205.7659040188865">Name</th><th>Type</th><th width="340.1572968009442">Description</th></tr></thead><tbody><tr><td>Image </td><td><a href="https://docs.unity3d.com/2018.2/Documentation/ScriptReference/UI.Image.html">Image</a></td><td>A reference of the input Unity3D Image Component</td></tr><tr><td>Material</td><td><a href="https://docs.unity3d.com/ScriptReference/Material.html">Material</a></td><td>The Material to be set</td></tr></tbody></table>

and produces the following output data:

<table><thead><tr><th width="186.7659040188865">Name</th><th width="207.3279424240331">Type</th><th width="340.1572968009442">Description</th></tr></thead><tbody><tr><td>Output</td><td><a href="https://docs.unity3d.com/2018.2/Documentation/ScriptReference/UI.Image.html">Image</a></td><td>A reference of the updated Unity3D Image Component</td></tr></tbody></table>

<figure><img src="/files/aLv4c3T2mlWiM2CBsM1w" alt=""><figcaption></figcaption></figure>

#### Set Image Sprite

This [OverNode](/over-sdk-manual/over-visual-scripting-legacy/visual-scripting-essentials/overnode.md) is used to modify an existing Image Component, by setting its sprite.

This Flow [OverNode](/over-sdk-manual/over-visual-scripting-legacy/visual-scripting-essentials/overnode.md) accepts the following input data:

<table><thead><tr><th width="205.7659040188865">Name</th><th>Type</th><th width="340.1572968009442">Description</th></tr></thead><tbody><tr><td>Image </td><td><a href="https://docs.unity3d.com/2018.2/Documentation/ScriptReference/UI.Image.html">Image</a></td><td>A reference of the input Unity3D Image Component</td></tr><tr><td>Sprite</td><td><a href="https://docs.unity3d.com/2018.2/Documentation/ScriptReference/Sprite.html">Sprite</a></td><td>The Sprite to be set</td></tr></tbody></table>

and produces the following output data:

<table><thead><tr><th width="186.7659040188865">Name</th><th width="207.3279424240331">Type</th><th width="340.1572968009442">Description</th></tr></thead><tbody><tr><td>Output</td><td><a href="https://docs.unity3d.com/2018.2/Documentation/ScriptReference/UI.Image.html">Image</a></td><td>A reference of the updated Unity3D Image Component</td></tr></tbody></table>

<figure><img src="/files/w7qBc0useuk3T564KPDU" alt=""><figcaption></figcaption></figure>

#### Set Image Color

This [OverNode](/over-sdk-manual/over-visual-scripting-legacy/visual-scripting-essentials/overnode.md) is used to modify an existing Image Component, by setting its Color.

This Flow [OverNode](/over-sdk-manual/over-visual-scripting-legacy/visual-scripting-essentials/overnode.md) accepts the following input data:

<table><thead><tr><th width="205.7659040188865">Name</th><th>Type</th><th width="340.1572968009442">Description</th></tr></thead><tbody><tr><td>Image </td><td><a href="https://docs.unity3d.com/2018.2/Documentation/ScriptReference/UI.Image.html">Image</a></td><td>A reference of the input Unity3D Image Component</td></tr><tr><td>Color</td><td>Color</td><td>The color to be set</td></tr></tbody></table>

and produces the following output data:

<table><thead><tr><th width="186.7659040188865">Name</th><th width="207.3279424240331">Type</th><th width="340.1572968009442">Description</th></tr></thead><tbody><tr><td>Output</td><td><a href="https://docs.unity3d.com/2018.2/Documentation/ScriptReference/UI.Image.html">Image</a></td><td>A reference of the updated Unity3D Image Component</td></tr></tbody></table>

<figure><img src="/files/6spDYnLBcdqsMY143tNh" alt=""><figcaption></figcaption></figure>

#### Set Image Fill Amount

This [OverNode](/over-sdk-manual/over-visual-scripting-legacy/visual-scripting-essentials/overnode.md) is used to modify an existing Image Component, by setting its Fill Amount.

For this node to work correctly, the Image type must be set to `Filled`.

This Flow [OverNode](/over-sdk-manual/over-visual-scripting-legacy/visual-scripting-essentials/overnode.md) accepts the following input data:

<table><thead><tr><th width="205.7659040188865">Name</th><th>Type</th><th width="340.1572968009442">Description</th></tr></thead><tbody><tr><td>Image </td><td><a href="https://docs.unity3d.com/2018.2/Documentation/ScriptReference/UI.Image.html">Image</a></td><td>A reference of the input Unity3D Image Component</td></tr><tr><td>Fill Amount</td><td>Float</td><td>The amount to be filled [0,1]</td></tr></tbody></table>

and produces the following output data:

<table><thead><tr><th width="186.7659040188865">Name</th><th width="207.3279424240331">Type</th><th width="340.1572968009442">Description</th></tr></thead><tbody><tr><td>Output</td><td><a href="https://docs.unity3d.com/2018.2/Documentation/ScriptReference/UI.Image.html">Image</a></td><td>A reference of the updated Unity3D Image Component</td></tr></tbody></table>

<figure><img src="/files/D5pSVBoujvSBd5YF473y" alt=""><figcaption></figcaption></figure>