Customising the widget's appearance
Open Widget in the sidebar and switch to the Customize tab. Six numbered sections cover the name, colours, logo, placement, toggles and lead form, with a live preview beside them and one Save changes button.
Last checked against the running product on 30 August 2026.
Everything on this screen belongs to one agent. The header shows which one, along with its revision number and whether it is published or still a draft.
Check which agent you are editing
The Widget screen picks an agent for you: the first live one in the workspace, or the first agent of any kind if none is live. With several agents, read the name in the sticky bar before you start changing colours.
Section 1 — Bot identity
Bot display name (up to 60 characters) is the name in the widget header. Leave it empty to keep using the agent's own name. Tagline (up to 140 characters) sits underneath it.
Section 2 — Theme
Five ready palettes and one custom option. The palettes are defined on the server, so they look identical in the preview and on your site.
The theme presets available in the widget studio Theme Description Ocean blue Calm and professional Forest green Natural and balanced Sunset orange Warm and energetic Summer yellow Bright and cheerful Royal purple Creative and luxurious Custom Customizable for you — you set each colour yourself Choosing Custom reveals seven colour fields: Primary (header and launcher), Accent (send button and highlights), Background, Message bubble, Text, and the two text-on-colour values. Leave the last two empty and Garuda picks whichever of black or white is more readable on your fill.
Unreadable colours are refused, not just warned about
The screen measures the same contrast ratios the server enforces — 4.5:1 for body text, 3:1 for interface text — and shows an amber warning as you type. If you save anyway, the server rejects it and names the pairing that failed.
Section 3 — Chat logo
Paste an absolute HTTPS URL to an image you already host. There is no upload here, so the file has to live somewhere already. Leave it empty and the widget shows a monogram taken from the display name. A URL that will not load falls back to the monogram, and the screen tells you.
Section 4 — Widget position
Six placements, drawn as the page they land on: bottom right, bottom left, middle right, middle left, top right and top left. The Launcher label field sits under them; leave it empty for the icon on its own.
Section 5 — Toggle options
Nine switches. Four of them change what a visitor sees today:
The widget toggles that change what a visitor sees Toggle Effect Chat On by default. Turning it off hides the entire widget — launcher included — because typing is the only conversation this widget offers. Autostart Opens the conversation as soon as the page loads. Show lead form Asks for contact details before the conversation starts. Glowing launcher Adds a soft glow around the launcher button. Transparent panel Lets the page show through the widget panel. Autostart and Show lead form cannot both be on: one opens the conversation immediately, the other gates it behind a form. Switching one on switches the other off, and the rows say so.
Section 6 — Lead form
Only shown when Show lead form is on. It is covered in Building a custom lead form.
Save changes
The sticky bar shows an Unsaved changes badge while anything is pending, and the browser asks before you leave the page with work in it. Discard puts everything back to the last saved state. Once saved, the change reaches visitors on their next page load.
Four switches have no visible effect yet
Transcription, Mute on minimize, Mute on tab change and Agent mute describe audio behaviour, and this widget is text only. Their values are saved and published on the widget element for a future voice surface to read; Agent mute additionally shows a muted badge in the panel. Nothing else about them changes what a visitor experiences today.
The agent editor's Appearance section also holds a header colour, accent colour, launcher text and two of the six positions. It writes the same underlying fields, so the two screens agree — this one simply offers all of them.
If it still does not work
Save changes is greyed out
Nothing has changed since the last save. The bar reads Everything here is saved.
A red bar says the agent was changed somewhere else
Somebody saved this agent in another tab or another screen while you were working. Use Reload the agent to take the newer version — which discards what is on your screen — and make your changes again.
The save is rejected over contrast
The message names the pairing: text on the background, text on a message bubble, header text on the primary colour, or button text on the accent colour. Darken or lighten one of the two colours in that pair until the amber warning clears.
The widget on your site still looks the same
Hard-refresh the page. If it still looks unchanged, check the sticky bar named the agent whose key is actually in your snippet — editing one agent and installing another is the usual explanation.
Related articles
- ConfiguringBuilding a custom lead formSection 6 of Widget, Customize lets you set the heading, the submit text and up to 20 fields, each with a type and an identifier that decides where the answer is stored.
- ConfiguringSetting up lead capture and consentLead capture is on by default and offers the contact form from the visitor's third message. Nothing is stored until the visitor ticks the consent box, and the server refuses submissions without it.
- TroubleshootingMy widget is not showing upFour causes account for nearly every missing widget: the agent is not published, the domain is not approved, the snippet is not really on the page, or the Chat toggle is off. Check them in that order.