Appearance

Customize the look and feel of your chatbot widget to seamlessly integrate with your brand's identity. The Appearance page allows you to adjust colors, text, avatars, and layout preferences without writing any CSS.

Key Features

• Global & Launcher Colors: Control the primary theme color and the chat bubble launcher background.
• Message Bubbles: Granular color controls for user and agent message bubbles, including text colors.
• Custom Text: Personalize the header title, subheader description, welcome message, and chat input placeholder.
• Custom Icons: Upload your own brand assets for the Bot Avatar and the Launcher Icon.
• Theme & Layout: Switch between light and dark themes, and choose where the widget docks on your website.

How to Use

Customizing Colors

Locate the color pickers across the Global & Launcher and Message Bubbles sections.

1. Click the color swatch box to open your browser's native color picker.
2. Alternatively, you can type a specific Hex code (e.g., #000000) directly into the text input box.
3. As you adjust these, you can preview how they affect the primary interface, the launcher button, and the individual chat bubbles for both the user and the agent.

Editing Widget Text

Scroll down to the text input sections to define what your users read when they open the chat:

• Header Text: The main title at the top of the widget (e.g., "Support Bot").
• Subheader Description: Optional text displayed directly below the header (e.g., "Replies typically in 5 minutes").
• Welcome Message: The first message the bot sends to greet a new user.
• Chat Input Placeholder: The hint text inside the typing area (e.g., "Ask a question...").

Uploading Avatars & Icons

Make the bot feel native to your company by uploading custom images:

1. Under Bot Avatar or Launcher Icon, click the Upload Image button.
2. Select an image file from your computer.
3. A loading spinner will appear over the preview window while the image uploads. Once finished, the new icon will display. To revert or change it, simply upload a new image.

Theme and Widget Position

At the bottom of the page, use the dropdown menus to finalize the widget's layout:

• Theme: Choose between Light or Dark mode.
• Widget Position: Choose to dock the widget to the Bottom Right or Bottom Left of the screen.

Important Notes (or Pro Tips)

• Permissions: Only workspace owners can modify the Appearance settings. If you are an agent, all inputs and upload buttons will be disabled.
• Bot Avatar Limits: The uploaded image must be less than 5MB. The recommended size is 64x64px, and supported formats are PNG, JPG, or GIF.
• Launcher Icon Limits: The uploaded image must be less than 2MB. The recommended size is 64x64px, and it is highly recommended to use a PNG with a transparent background for the best visual result against your Launcher Color.