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

# Appearance

> The Appearance settings allow you to customize the look and feel of the AI Chat Widget on your storefront, so it matches your brand and enhances the user experience.

<img src="https://mintcdn.com/neopal/kwREAMNoDC01oO-L/images/appearance/appearance.png?fit=max&auto=format&n=kwREAMNoDC01oO-L&q=85&s=16fcfd5f75ffee73f362a9efd1015929" alt="Appearance Pn" width="1440" height="1033" data-path="images/appearance/appearance.png" />

### Enable the Widget

To display the NeoPal Chat Widget on your storefront, you need to enable it via the **Theme Editor** in your **Shopify Admin**.

<img src="https://mintcdn.com/neopal/kwREAMNoDC01oO-L/images/appearance/appearance_turn_on_chat_widget_shopify.png?fit=max&auto=format&n=kwREAMNoDC01oO-L&q=85&s=6d56b78c7b57c2c459cad2c8c17cb6d0" alt="Appearance Turn On Chat Widget Shopify Pn" width="778" height="452" data-path="images/appearance/appearance_turn_on_chat_widget_shopify.png" />

If the widget is turned off, the chat window will not appear on your storefront, and you’ll see a notification like this:

<img src="https://mintcdn.com/neopal/kwREAMNoDC01oO-L/images/appearance/appearance_turned_off_chat_widget.png?fit=max&auto=format&n=kwREAMNoDC01oO-L&q=85&s=af5270960aabeeb1df1d3d85b616d356" alt="Appearance Turned Off Chat Widget Pn" width="1184" height="1033" data-path="images/appearance/appearance_turned_off_chat_widget.png" />

### AI Agent Name

By default, your AI Agent is named **Neo**.

You can change this name to better match your brand voice or persona.

<img src="https://mintcdn.com/neopal/kwREAMNoDC01oO-L/images/appearance/appearance_name.png?fit=max&auto=format&n=kwREAMNoDC01oO-L&q=85&s=46b1894be5577d412b8d3c692f85e718" alt="Appearance Name Pn" width="1184" height="1033" data-path="images/appearance/appearance_name.png" />

### Launcher Icon

The **Launcher Icon** is the small icon shown inside the widget’s launch button.

You can upload a custom image that reflects your brand identity.

<img src="https://mintcdn.com/neopal/kwREAMNoDC01oO-L/images/appearance/appearance_launcher_icon.png?fit=max&auto=format&n=kwREAMNoDC01oO-L&q=85&s=0ef14fb70dfddd52d2da11bc2deb13b5" alt="Appearance Launcher Icon Pn" width="1184" height="1033" data-path="images/appearance/appearance_launcher_icon.png" />

### Avatar

The **Avatar** appears at the top of the chat window, giving users a visual sense of who they’re talking to.

By default, it matches the launcher icon, but you can upload a separate image.

<Info>
  The avatar is displayed in a circular frame. To ensure it looks good, upload a **square image** with a file size under **1MB**.
</Info>

<img src="https://mintcdn.com/neopal/kwREAMNoDC01oO-L/images/appearance/appearance_avatar.png?fit=max&auto=format&n=kwREAMNoDC01oO-L&q=85&s=34cf56795c52bfff10a8ff8e49150eba" alt="Appearance Avatar Pn" width="1184" height="1033" data-path="images/appearance/appearance_avatar.png" />

### Header Text

This is the line of text displayed in the widget’s header.

You can customize it to show a hotline number, a promotional message, or a friendly greeting — whatever fits your needs.

<img src="https://mintcdn.com/neopal/kwREAMNoDC01oO-L/images/appearance/appearance_header_text.png?fit=max&auto=format&n=kwREAMNoDC01oO-L&q=85&s=5f5736dfbc6ba33b3b051fbc60aa85a7" alt="Appearance Header Text Pn" width="1184" height="1033" data-path="images/appearance/appearance_header_text.png" />

### Widget Position

Choose where the widget appears on your website. There are three position options:

1. **Bottom right corner** (default)
2. **Bottom center**
3. **Bottom left corner**

<img src="https://mintcdn.com/neopal/kwREAMNoDC01oO-L/images/appearance/appearance_widget_position.png?fit=max&auto=format&n=kwREAMNoDC01oO-L&q=85&s=9e35f23ad046a1ba3b5082c3f6decb1d" alt="Appearance Widget Position Pn" width="1184" height="1033" data-path="images/appearance/appearance_widget_position.png" />

**Notification Content**

When a message is sent but the chat window hasn’t been opened, it will appear as a **notification preview**.

Customers can choose to open the message or dismiss the notification.

<img src="https://mintcdn.com/neopal/kwREAMNoDC01oO-L/images/appearance/appearance_notification_content.png?fit=max&auto=format&n=kwREAMNoDC01oO-L&q=85&s=796dc12614d1e71f354bc9e70ec0c64f" alt="Appearance Notification Content Pn" width="1184" height="1033" data-path="images/appearance/appearance_notification_content.png" />

You can customize the notification content to show either **text only** or the **full message**, including images, product cards, discount codes, and more.

<CardGroup cols={2}>
  <Card title="Text only">
    <img src="https://mintcdn.com/neopal/kwREAMNoDC01oO-L/images/appearance/notification_content_text_only.png?fit=max&auto=format&n=kwREAMNoDC01oO-L&q=85&s=ad0dba69a7173e2b3a6d42616a21ec94" alt="Notification Content Text Only Pn" width="261" height="362" data-path="images/appearance/notification_content_text_only.png" />
  </Card>

  <Card title="Full content">
    <img src="https://mintcdn.com/neopal/kwREAMNoDC01oO-L/images/appearance/notification_content_full.png?fit=max&auto=format&n=kwREAMNoDC01oO-L&q=85&s=4cd698c8ef382e3c81346d01641f485e" alt="Notification Content Full Pn" width="261" height="362" data-path="images/appearance/notification_content_full.png" />
  </Card>
</CardGroup>
