> For the complete documentation index, see [llms.txt](https://fast-studios.gitbook.io/press-e/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://fast-studios.gitbook.io/press-e/manual/ui.md).

# UI

The UI system works by **instantiating a prefab** that has the **`UIPrefab`** script **at the root**. The [**Manager**](/press-e/manual/components/interaction-manager.md) includes its own **Canvas** and spawns **different prefabs** depending on the situation (see the [Interaction Manager](/press-e/manual/components/interaction-manager.md) page for the cases). If an [**Interactable**](/press-e/manual/components/interactable.md) is **overriding** the [UI prefab](/press-e/manual/components/ui-prefab.md), the system uses the overrided prefab.

## Connect your UI

Sometimes you’ll want to show something in the UI that isn’t covered out of the box. You can **manually change values** by referencing the [**`UIPrefab`**](/press-e/manual/scripting/ui-prefab.md).

```csharp
// Outside Class
using FastStudios;

// Inside Class

public UIPrefab UiPrefab;

public void ChangeBackgroundColor(Color newColor)
{
    UiPrefab.Background.color = newColor;
}

// Or if you dont want to create a field, you can get from your object

public void ChangeInteractionText(GameObject uiPrefab, string newText)
{
    uiPrefab.GetComponent<UIPrefab>().InteractionTmpText.text = newText;
    
    // For more safety you can use TryGetComponent
    
    if (uiPrefab.TryGetComponent<UIPrefab>(out var UiPrefab))
    {
        UiPrefab.InteractionTmpText.text = newText;
    }
    else
    {
        Debug.Log($"UI Prefab missing on: {uiPrefab}");
    }
}
```

## Useful Scripts

You can add scripts **inside the UI prefab** so it behaves correctly for any interaction type, for example:

* **UI Interaction Conditions** — controls whether a **UI object** is **active or not** depending on the **interaction type** that spawned the UI Prefab. Example: you have a fixed text in the prefab and you only want it **during Drag**. Add **UI Interaction Conditions** script to the Text and configure what happens **when Drag starts/ends**; the script will **enable/disable** the object accordingly.