Get started
Customize appearance
All visual settings live under Widget → Customize. The right-hand panel shows a live preview as you edit, so every change is visible before you save.
Auto-extract from your site
If you entered a website during onboarding, Quincer has already fetched your logo, primary brand color, and typography. The auto-extracted values appear pre-filled at the top of the Customize page. Click Use these to apply them instantly, or override each field manually.
To re-run extraction against a different URL, open the Brand Extractor panel, paste a URL, and click Extract.
Brand identity
| Field | Purpose |
|---|---|
| Brand name | Shown in the chat header. |
| Tagline | A short line under the brand name, e.g. Ask us anything. |
| Avatar | A URL to an image, an emoji, or initials. Square images look best. |
| Welcome message | The first message the visitor sees. Supports emojis. |
Colors
Quincer separates the header bar from the accent used for buttons and links:
| Token | What it controls |
|---|---|
primary | Header + launcher bar background. |
accent | Send button, links, typing dots. |
accentText | Text color on top of the accent (usually white). |
text | Body text inside the chat panel. |
background | Chat panel body (defaults to primary if unset). |
inputBackground | Background of the message input field. |
botBubble | Background of bot message bubbles. |
Quincer derives hover states, border colors, and muted text from these seeds automatically. You usually only need to set primary and accent.
Position & layout
| Option | Values | Notes |
|---|---|---|
position | bottom-right, bottom-left | Corner of the viewport where the launcher pins. |
bottomOffset | integer (px) | Pixels from the bottom edge. Defaults to 28. |
sideOffset | integer (px) | Pixels from the left/right edge. Defaults to 28. |
bubbleStyle | bar or button | bar shows an input + send button launcher. button is a minimal circular icon. |
Voice UI layout
When voice is enabled on a widget, the Voice layout picker (on the Appearance tab) decides how calls are presented: Hybrid (default), Takeover, Inline, or Strip. A live visual preview shows the chosen layout, and a Try voice live button iframes the real widget so you can test the selection with a Desktop/Mobile toggle.
Full breakdown of each layout — with screenshots and when to pick which — on the Voice chat → UI layouts page.
Behavior
Proactive mode
Turn on Proactive mode and the widget opens itself after a configurable
delay (default 5000ms) with a context-aware greeting. You can write a custom
greeting per page or let the agent auto-detect the page topic.
Visitor identification
Provide a Google Client ID to enable Google One Tap, which captures the visitor's name and email before the conversation starts. This dramatically improves lead enrichment and CRM sync quality.
Conversation persistence
By default the widget persists the active conversation in localStorage, so
returning visitors pick up where they left off. Disable this per-persona if you want a
fresh session on every visit.
Save & publish
Changes are saved per widget, per workspace, and take effect immediately for all visitors.
The widget fetches the latest config from /api/embed/config on page load, with
a 5-minute CDN cache. Hard refreshes will pick up changes instantly.
If you rename a persona or change URL patterns, visitors mid-conversation keep the old persona until they reload.
Overriding from code
Every field in the Customize tab can also be passed directly to the widget via
window.ChatWidgetConfig. Values passed in code win over dashboard settings.
Useful for A/B testing or per-page overrides:
window.ChatWidgetConfig = {
apiKey: "cw_live_...",
apiUrl: "https://chat.quincer.com/api",
brand: "Acme Pricing",
welcomeMessage: "Questions about enterprise pricing? I can help.",
colors: { primary: "#0a0a14", accent: "#eb8424" },
position: "bottom-right",
proactiveGreeting: "Looking at enterprise? I can pull up pricing for your team size."
};