Everything about how the widget looks and every word it says lives in Settings > Design & copy. Changes appear instantly in the live preview beside the controls, and you can click any part of the preview to jump straight to the controls for it.
The approach is deliberate: you set a brand color, and the rest of the widget derives from it. You only reach for individual controls when you want something specific.
1. Start with a look#
Presets are complete starting points — HyperHelp, Default, Ocean, Forest, Sunset, Lagoon and Aurora. Pick one and change anything you like afterwards. Shuffle picks a random combination if you would rather explore than decide.
2. Make it yours#
Brand color is the setting that drives everything else. Buttons, message bubbles, accents and the citation tiles are all derived from it.
Surface style decides how the panel background relates to your brand:
| Style | Result |
|---|---|
| Light | A clean white panel with a barely-there tint of your brand |
| Tinted | Every surface visibly washed with your brand |
| Dark | Near-black surfaces nudged toward your brand |
The same step covers corner roundness (Sharp, Soft, Round or Pill), panel width (360–420 px works well), the launcher icon, the pulse indicator — the attention dot on the launcher button — and the status badge shown in the header, such as "Online".
3. Fine-tune#
Every zone follows your brand automatically, so this step is optional. Open a zone only when you want to override something specific:
Launcher button, Header, Status badge, Messages, Sources, Suggested replies, Composer, Empty state, and Errors & status messages.
Each zone holds two kinds of control:
- Wording — the exact text the widget shows. Leave a field untouched to keep the shipped default, shown greyed out as the placeholder. ✕ clears a field to nothing, which is how you get an icon-only launcher or a header with no subtitle. ↺ restores the default.
- Colors and sizes — marked AUTO while they follow your brand, and SET once you override them. The ↺ beside a SET control returns it to AUTO.
Reset all to auto returns every override in the section at once.
Tip: The launcher's font size scales its icon too, so one control makes an icon-only launcher larger or smaller. The icon always takes the label color.
Note: Changing your brand color or surface style resets the lead capture form's colors to match the new design. That is deliberate — the form is meant to look like the rest of your widget.
Source citations#
When Show sources in answers is on (Settings > General), each answer is followed by the pages it drew from: a heading such as "Citing 2 sources", then one row per page with a link icon and the page title. Visitors click a row to open the source.
The heading is yours to change under the Sources zone. Writing :count in it inserts the number of cited pages — the default is Citing :count sources. A heading without :count is shown exactly as written.
Intro message and suggested questions#
The opening message and the tappable suggestion chips beneath it are set in Settings > General > First impression, not here — they are what the chatbot says, rather than how it looks.
Three short suggested questions work best; more starts to look like a menu. You can have up to five.
Style overrides in the embed code#
For per-page or per-site overrides without touching the dashboard, pass styleOverrides in your embed snippet. This is useful when the same chatbot serves several sites with different branding.
See the developer reference for the full list of override keys, and for customCss if you need to go further.