Contact usRequest a demo

This document describes version 6 of Unblu. If you’re using the latest major version of Unblu, go to the documentation of the latest version.

The support period for version 6 ended on 29 August 2023. We no longer provide support or updates for this version. You should upgrade to the latest version of Unblu.

Unblu UI theming cheat sheet

Collection of property keys to assist you in configuring the Unblu user interface

Where to start

In order to start configuring your Unblu theming you must be an Admin or Superadmin. Once logged in, go to your Account space by clicking on the top right avatar and choosing “Manage account” from the list.

where to start user menu

In the Account space side navigation bar, choose “Settings”.

where to start settings

The Settings tab allows you to filter through configurations with the possibility of doing a more specific search by clicking on the Advanced button.

The advanced search allows you to match your filter value against a:

  • Label: filter for words in the configuration label.

  • Description: filter for words in the description of a configuration label.

  • Key: filter by the configuration property key

  • Group: filter for a specific group configuration block, such as: Font Configuration, Agent desk left navigation bar style, etc…​

Under Options the following are available:

  • Show inherited (global level, product default): this filter is checked by default. It displays configuration settings that have been changed on account level.

  • Show unpopular (called “show internal” for superadmins): set of configuration keys that are not used often.

  • Technical labels: displays the configuration labels with technical names. When exchanging information about configurations, technical labels are required.

where to start settings filters

General configurations


The product color palette is defined by four main colors: primary, secondary, neutral and gray. Each of these colors have an extended color palette composed of varying degrees of saturation / brightness which can be used throughout various elements of the user interface.


1. Primary palette 2. Secondary palette
3. Neutral palette 4. Gray palette

Feedback colors and secondary color map

feedback and secondary colors

Visitor theme

Chat conversation panel (1/3)

chat conversation panel 1

  • 1. Unblu Concierge

    • Documentation to change the Concierge avatar and its name can be found here: Concierge Person

  • 2. Secondary button style

  • 3. Primary button style

    • Refer to #primary-and-secondary-buttons>>

  • 4. Back button

    • Configuration setting that determines if the visitor’s chat action bar will contain the back button (the back button allows the visitor to go back to the conversation overview):

    • com.unblu.visitor.ui.pinentry.allowBack

  • 5. Flat inverted button

Video chat conversation panel (2/2)

video chat conversation panel 2

Visitor collaboration space (2/3)

visitor collaboration space 2

Visitor collaboration space (3/3)

visitor collaboration space 3

Agent UI theme

Agent Desk collaboration space (5/6)

agent desk collaboration space 5

Account UI theme

Headless browser theme

The headless browser displays four default pages that consist of an image and some text. These text and configuration properties can be customized.

It is possible to change the colors for all of the pages:

Universal co-browsing about page

This landing page can be used when a new "Websites" collaboration layer is opened. It is possible to change the default page with com.unblu.conversation.headless-browser.defaultNewWindowLocation.

The local URL to display this page is about:unblu.universal-cobrowsing.

about websites

The text items can be changed with:

Document co-browsing about page

This landing page is used when a new "Documents" collaboration layer is opened.

The local URL to display this page is about:unblu.document-cobrowsing.

about document

The text can be changed with:

Error page

The error page is displayed when an error occurs:


The text items can be changed with:

Crash page

The crash page is displayed when the process rendering the page crashes.