Appearance
Theme Selection
| Theme Presets | Built-in preset themes for quick visual configuration. |
| Custom Theme Mode | Enables full manual control of color tokens and overrides. |
| Light/Dark Preview Toggle | Switches editing/preview context between light and dark mode surfaces. |
| Reset All Colors | Restores generated and override colors to baseline theme values. |
Base Color System
| Primary Base Color | Core brand/action color used to derive major interaction tokens. |
| Accent Base Color | Complementary emphasis color used for links and highlight tokens. |
| Neutral Base Color | Foundation color used for borders, icons, and muted UI states. |
| Surface Base Color | Base background/surface color used for panels and layout fills. |
| Derived Color Scales | Base colors generate multiple tonal steps to build full design token sets. |
General Appearance Controls
| Font Size | Numeric setting for global widget text scale. |
| Font URL | External font source URL input (for example hosted web-font source). |
| Font Family | Select/autocomplete field for default font family in widget UI. |
| Body Background Color | Background color token for main widget body area. |
| Gutter/Container Color | Color token for spacing or container context around main content area. |
Component Overrides
| Top Bar Colors | Controls top/header background and text colors. |
| Agent Bubble Colors | Controls agent bubble background, text, and reference text colors. |
| User Bubble Colors | Controls user bubble background and text colors. |
| Input Box Colors | Controls input background, text, border, and focused-border colors. |
| Send Button Colors | Controls enabled/disabled/hover states for send button background and icon. |
| Suggestion Colors | Controls suggestion chip background, text, arrow, and hover colors. |
| CTA and Utility Colors | Controls action surfaces such as CTA button, spinner, and related visual elements. |
| Uploaded Files Area Color | Controls background/tone for uploaded files display section. |
Override Management Behavior
| Override Lock | Locks a token override to prevent auto-regeneration from replacing it. |
| Section-level Reset | Resets overrides within a specific category without resetting all appearance values. |
Advanced CSS
| Custom CSS Editor | Code editor for additional CSS rules beyond standard token controls. |
| Generated CSS Segment | System-generated CSS variable block managed by the theme engine. |
| Manual CSS Segment | User-maintained CSS area intended for custom styling rules. |
| Preview-aware Styling | CSS updates are reflected in preview to validate visual outcomes before final usage. |