> ## Documentation Index
> Fetch the complete documentation index at: https://docs.gp.scale.com/llms.txt
> Use this file to discover all available pages before exploring further.

# UI Customization

> Scale Generative AI Platform supports basic customization options for the UI of your application.

## Create Theme

If you want customize the UI, select **Create New Theme** under the **Application Settings** section.

<Frame>
  <img src="https://mintcdn.com/scalegp/1vQnbXFkjbQbcgd1/images/37bf589-Screenshot_2024-07-17_at_4.35.17_PM.png?fit=max&auto=format&n=1vQnbXFkjbQbcgd1&q=85&s=81af2d42b4c83e31a333471e467ec74e" alt="Create New Theme" width="1156" height="582" data-path="images/37bf589-Screenshot_2024-07-17_at_4.35.17_PM.png" />
</Frame>

Creating a theme enables you to select the following options:

* Primary Accent Color: Hex Code
* Secondary Accent Color: Hex Code
* Background Color: Hex Code
* Foreground Color: Hex Code
* Chat Icon: Image (JPG, PNG, WeP, SVG)

For the chat app that we currently support:

* **Primary Accent Color** is used for the icon of the bot and the text color of the button.
* **Secondary Accent Color** is used for the background color of the button.
* **Background Color** is used for the background of the app.
* **Foreground Color** is used for the color of the text.
* **Chat Icon** is used as the icon for the application displayed on the left side of the screen

The theme editor will allow you to play around with the settings you select and show you what your application will look like.

<Frame>
  <img src="https://mintcdn.com/scalegp/_1tSRXzqUSANQJ5q/images/bb55f64-Screenshot_2024-07-17_at_4.43.59_PM.png?fit=max&auto=format&n=_1tSRXzqUSANQJ5q&q=85&s=7725cb9450413fc54a868862311a648e" alt="Theme Editor" width="2308" height="996" data-path="images/bb55f64-Screenshot_2024-07-17_at_4.43.59_PM.png" />
</Frame>

## Select Theme

After creating a theme, you can apply the theme by navigating back to the **Application Settings** section and selecting the theme you created from the drop down.

To view the changes in theme for your application, simply refresh the application. The theme will apply to your application without having to deploy again.

<Frame>
  <img src="https://mintcdn.com/scalegp/1vQnbXFkjbQbcgd1/images/0b82a91-Screenshot_2024-07-17_at_4.46.37_PM.png?fit=max&auto=format&n=1vQnbXFkjbQbcgd1&q=85&s=ead4b6c78afd3ea23935e6c9699542fc" alt="Select Theme" width="302" height="492" data-path="images/0b82a91-Screenshot_2024-07-17_at_4.46.37_PM.png" />
</Frame>
