Leader24Leader24
🇬🇧

Customize Widget

Customize the appearance and behavior of the chat widget

Adapt the widget to your brand identity and customer needs.

Access Customization

  1. Go to Agents > Select agent
  2. Click on Widget tab
  3. You'll find all customization options

Theme Options

Colors

OptionDescription
Primary ColorButton and header color
BackgroundChat window background
TextText color
User BubbleYour visitors' message color
Bot BubbleAgent response color

Position

Choose where to display the widget:

  • Bottom Right (default)
  • Bottom Left

Size

  • Standard: 380x600px
  • Compact: 320x500px
  • Large: 420x700px

Texts

Customize all displayed texts:

Welcome Title: "Hello! 👋"
Welcome Message: "How can we help you?"
Input Placeholder: "Write a message..."
Send Button: "Send"

Button (Launcher)

The button that opens the chat:

  • Icon: Choose from available icons
  • Text: Optional text next to icon
  • Animation: Pulse, bounce, or none
  • Delay: Time before appearing

Behavior

Auto-open

Auto-open: Yes/No
Delay: 5 seconds
Only First Visit: Yes/No

Welcome Messages

Configure automatic welcome messages:

  1. First message: Immediate greeting
  2. Second message: After X seconds
  3. Quick actions: Suggested buttons

Sound

  • Enable/disable notification sound
  • Volume
  • Custom sound (Pro)

Branding

Upload your company logo:

  • Format: PNG, JPG, SVG
  • Recommended size: 120x40px
  • Appears in header

Company Name

Displayed name in the header.

"Powered by" Removal

Available in Pro plans.

Advanced CSS

For advanced customization:

css
/* Custom CSS example */
.leader24-widget {
  --l24-primary: #your-color;
  --l24-radius: 12px;
}

Preview

Use the preview to see changes in real-time before saving.

Best Practices

Tips

  • Use colors consistent with your brand
  • Keep texts short and welcoming
  • Test on mobile and desktop
  • Don't enable auto-open too early (at least 10s)

Save and Publish

  1. Make desired changes
  2. Use Preview to verify
  3. Click Save
  4. Changes are live immediately

Next steps

  • Get embed code
  • Monitor conversations
  • Manage leads
© 2026 Leader24.