Customize the Chat Launcher (Position, Color & Icon)
The launcher is the floating button visitors see in the corner of your website to start a conversation with your team or AI assistant. In JIVIQ, you can configure the button's corner position, brand hex color, and vector icon directly in the admin dashboard under Settings → Chatbox Widget (named Chat Studio on newer accounts) without writing CSS or modifying website code.
Launcher Configuration Summary
Corner Positions
Choose between Bottom Right (default) or Bottom Left to suit your website layout.
Brand Hex Color
Defaults to classic navy (#000666). Pick or paste your exact primary brand hex color code.
Three Official Icons
Select from Chat, Help, or Message vector icon styles.
Chat Button (Launcher)
Choosing the Corner Position
The launcher sits anchored in one of the lower corners of your visitor's browser viewport. JIVIQ provides two verified position settings:
Bottom Right (Recommended Default)
Bottom Right is the default position across all JIVIQ workspaces. Website visitors naturally look to the bottom right corner when seeking immediate customer assistance or live support.
Bottom Left
Select Bottom Left if your website already has persistent elements in the lower right—such as a "Back to Top" floating button, a cookie consent preference badge, or an e-commerce shopping cart subtotal badge.
Mobile Responsiveness
Regardless of whether you choose Bottom Left or Bottom Right, the JIVIQ widget automatically applies safe-area padding on mobile viewports so the button stays comfortably above iOS Safari and Android Chrome system bars.
Setting Your Brand Hex Color
The launcher color sets the circular background of the closed chat button. Maintaining clear contrast against your site background ensures visitors notice the button without it clashing with page content.
Default Navy (#000666)
Every new workspace defaults to JIVIQ's signature navy blue (#000666). This deep color provides high contrast on both white light-mode backgrounds and modern dark-mode palettes.
Logo Swatch Suggestions
When JIVIQ can read colors from your hosted logo link in panel settings, the color picker automatically suggests brand swatches. Otherwise, pick or paste your exact brand hex code.
Custom Hex Input
Have exact company brand guidelines? Simply type or paste your 6-character hex code (e.g., #1E40AF or #0F766E) directly into the hex input field for a precise match.
Launcher vs. Panel Color
The launcher button color is account-wide for website consistency. In contrast, the open chat panel color is customized per Workspace in Customize the Chat Panel.
Selecting a Launcher Icon
JIVIQ provides three launcher icons to choose from: Chat, Help, and Message.
JIVIQ Launcher Icon Comparison
Chat
Displays a speech bubble icon on the launcher button.
Help
Displays a question mark icon on the launcher button.
Message
Displays an envelope icon on the launcher button.
Where to Find Launcher Settings
Depending on when your JIVIQ account was established, launcher controls reside in one of two admin interface locations. Both interfaces configure the exact same live website widget:
| Interface Version | Admin Navigation Path | Wizard Step / Location |
|---|---|---|
| settings Classic Interface | Settings → Chatbox Widget | Step 2: "Customize launcher" in the four-step installation wizard. |
| auto_fix_high Newer Interface (Chat Studio) | Chat Studio (in the left admin sidebar) | Dedicated launcher settings card alongside panel, wording, and install tabs. |
Saving, Publishing & Propagation Authority
After changing launcher settings, follow the preview and publishing steps in Preview, Publish & Troubleshoot Widget Changes. That guide covers the difference between classic auto-save and Chat Studio drafts, the 1-minute caching lifecycle, allowed website domains, and Content-Security-Policy (CSP) checks.
For developers seeking technical specs and embed parameters, consult the official Customize Widget Developer Documentation.
Team Roles & Permissions
JIVIQ protects your live website appearance by enforcing strict role-based access controls on widget styling:
Owner & Admin Roles Only
Only Workspace Owners and Admins have permission to change Chat Widget launcher settings (position, color, and icon) and publish updates to the live site.
Team Members (View-Only)
Ordinary team members can view the widget settings and inspect preview configurations, but cannot edit or publish restricted Workspace settings.
The "First Paint" Look in Embed Snippets
When a visitor lands on your website, JIVIQ ensures sub-second load times by rendering an instant lightweight launcher button before external configuration requests complete.
Understanding the First Paint Mechanism
The initial position, color, and icon configured when you generated your embed code are baked directly into the snippet as data attributes (data-launcher-color, data-position, data-icon). This ensures visitors never experience Cumulative Layout Shift (CLS) or visual pop-in. Once the script connects to JIVIQ edge servers, it instantly applies any subsequent live updates.
If you ever dramatically alter your brand colors (e.g., from deep navy to bright orange) and wish to eliminate any momentary visual transition on slow cellular networks, you can re-copy a fresh snippet from Copy JIVIQ Widget Code or review technical script attributes in the Install Widget Documentation.
Remember that the widget also checks your authorized websites list. Make sure your domain is verified in Add Your Website Domain and verified in Verify Widget Installation.
Frequently Asked Questions
Explore answers regarding launcher positioning, hex colors, vector icon choices, permissions, and first-paint baselines.
JIVIQ provides two corner positions for the website chat launcher: Bottom Right and Bottom Left. The default setting is Bottom Right, which is the industry standard position where website visitors intuitively expect to find live messaging.
No. JIVIQ strictly restricts the launcher to Bottom Right or Bottom Left. This design rule ensures the floating button never covers critical top navigation bars, dropdown menus, or main hero banners.
The launcher button is fully responsive. It automatically maintains comfortable clearance above iOS Safari and Android Chrome bottom navigation bars so visitors can tap it effortlessly without misclicks.
Every new workspace defaults to JIVIQ's signature navy blue (#000666). This deep color provides high contrast on both light and dark website themes.
When you provide a working HTTPS logo link in your panel settings, JIVIQ analyzes the logo and presents suggested palette swatches. You can also paste an exact 6-character hex code directly into the input field.
The launcher button color applies globally across your website for brand consistency, whereas the open chat panel color can be customized per individual Workspace for multi-brand teams.
JIVIQ provides three launcher icons: Chat, Help, and Message.
In the classic interface, select your icon in Step 2: 'Customize launcher' under Settings → Chatbox Widget. In Chat Studio, select your icon within the launcher configuration section.
Yes. Workspace Owners and Admins can switch between Chat, Help, and Message at any time in the launcher settings.
Only Workspace Owners and Admins can modify Chat Widget settings and save changes. Ordinary team members can view the settings in the dashboard but cannot change restricted settings.
In the classic interface, navigate to Settings → Chatbox Widget. In the 4-step wizard, launcher customization is Step 2: 'Customize launcher'.
In newer accounts, open Chat Studio from the left admin sidebar to access the launcher position, color, and icon controls.
Your initial position, color, and icon are baked directly into the snippet as data attributes (data-launcher-color, data-position, data-icon). This renders the button instantly without layout shifts before live settings load.
Re-copying code from Copy Widget Code is only necessary if you make a radical brand color change and want to update the immediate first-paint baseline on slow mobile connections.
For complete details on Chat Studio drafts, publishing, the 1-minute caching lifecycle, and domain troubleshooting, see Preview, Publish & Troubleshoot Widget Changes.