The widget’s visual appearance is configured in the Design section of your project dashboard. Changes take effect immediately for new page loads (the widget config is fetched on initAsync).
Appearance settings
| Setting | Default | Options |
|---|
| Position | bottom-right | bottom-right, bottom-left |
| Show branding | true | true, false |
| Primary color | — | Any CSS color |
| Background color | — | Any CSS color |
| Text color | — | Any CSS color |
| Input background | — | Any CSS color |
| Input text color | — | Any CSS color |
| Navigation color | — | Any CSS color (shades derived for bg, icon, text) |
| Font family | — | Any CSS font-family |
| FAB icon | — | URL to a custom bubble icon |
| FAB text | — | Text label on the bubble |
null via the API removes the override.
Position
Control where the chat bubble appears on the page:
- bottom-right — default, suits most layouts
- bottom-left — use when the bottom-right conflicts with other UI elements
Branding
When showBranding is enabled, the widget displays a small “Powered by Agentic Trust” badge. Disable it for a white-label experience.
The widget fetches its configuration from GET /api/v1/widget/config on initialization. The response includes all design settings plus available workflows (skills):
{
"showBranding": true,
"position": "bottom-right",
"primaryColor": "#F97316",
"availableSkills": [
{
"id": "wf_abc123",
"name": "Refund Request",
"description": "Process a refund for an order"
}
]
}
Use initAsync instead of init to ensure the widget picks up your dashboard configuration. With init, the widget renders with hardcoded defaults.
