Skip to main content

Interface Customization

Customize how your chatbot looks on your website.

Accessing Interface Settings​

  1. Go to your dashboard
  2. Select a chatbot
  3. Click Settings > Interface

Theme​

Choose the color scheme for your chat widget:

ThemeDescription
LightWhite background, dark text
DarkDark background, light text
SystemMatches user's device preference
Brand Consistency

Choose a theme that matches your website's design for a seamless user experience.

Display Name​

The name shown in the chat widget header. This is what your users see.

Examples:

  • "Support"
  • "Ask AI"
  • "Company Assistant"

Leave empty to show no name in the header.

Initial Message​

The greeting message shown when a user opens the chat widget.

Examples:

  • "Hi! How can I help you today?"
  • "Welcome! Ask me anything about our products."
  • "Hello! I'm here to answer your questions."
Engaging Greetings

A good greeting sets expectations. Let users know what the chatbot can help with.

Suggested Messages​

Add pre-written prompts that users can click to start a conversation:

  1. Click Add Suggested Message
  2. Enter the message text
  3. Add up to 4 suggestions

Examples:

  • "What are your pricing plans?"
  • "How do I get started?"
  • "I need help with my account"

Widget Position​

Choose where the chat widget appears on your website:

  • Bottom Right (default)
  • Bottom Left

Brand Color​

Set your primary brand color for:

  • Send button
  • User message bubbles
  • Links and highlights

Enter a hex color code (e.g., #5045e6) or use the color picker.

Avatar​

Upload a custom avatar image for your chatbot. This appears next to AI responses.

Requirements:

  • Square image (1:1 ratio)
  • PNG or JPG format
  • Minimum 64x64 pixels

Preview​

The interface settings page shows a live preview of your chat widget. Changes are reflected in real-time before you save.

Mobile Optimization​

The chat widget is automatically optimized for mobile devices:

  • Full-screen mode on small screens
  • Touch-friendly buttons
  • Responsive layout

Save Changes​

Click Save to apply your customizations. Changes take effect immediately on your website.

Next Steps​