All questions

How to configure the widget’s appearance?

Updated 1 min read 32 / 81

Visual customization makes the chat an organic part of your website, which increases users' trust in the brand.

How to set up

  1. In the branding settings (Integrations section → Widget tab), upload the company logo and background image.
  2. In the integrations section, set up the color palette (background, buttons, fonts), the corner rounding radius of the window, and the widget's position on the screen.
  3. Set up the greeting text and the button label.

Result
You get a uniquely designed widget that fully matches your company's corporate style.


Updated on 19.10.26

You can customize the Binom chat widget (color, logo, button label, window size, and how often the greeting appears) in Integrations → Widget. This makes the online consultant button look like part of your website, and visitors immediately understand that it is your company's consultant.

Where to configure

Open Integrations → Widget. All changes appear on the right, in the "Chat preview" block. To save them, click "Update". You don't need to change the code on your site: the widget picks up the new settings automatically.

Window size

In the "Chat size" block, specify the width and height of the window in pixels.

Colors and window style

By default, the widget uses the shared colors from Settings → the "Branding" tab, the same ones used for the iFrame and the public link (how to set a unified brand style). To give the widget its own colors, select "Configure appearance separately". The following blocks will appear:

  • "Chat color": "Chat background color", "Chat icon color", "AI employee message background color", "AI employee message font color", "User message background color", "User message font color", "Message input font color", "Message input icon color";
  • "Style and design": corner rounding, inner padding, and the spacing between messages.

Widget button

In the "Widget icon settings" block:

  • "Priority icon language": the language of the labels on the button.
  • "Show greeting card": "On every page" or "Once per session". Choose the second option if you don't want the greeting to appear on every page transition.
  • "Custom icon label": a short text next to the button, for example "Ask a question".
  • "Label display time (seconds)" and "Label color": how many seconds the label is visible and what color it is.
  • "Widget logo": PNG, JPEG, WebP, or GIF up to 5 MB. An animated GIF is shown both on the button and in the pop-up panel.

Greeting

The text of the first message is set not here but in Settings → the "Main" tab, in the "Welcome message" field (up to 250 characters). For product pages, there is a separate "Product page greeting" field. Click "Save changes": the page will reload to apply the settings.

Possible issues

The message "Choose PNG, JPEG, WebP, or GIF up to 5 MB"

What to do: save the logo in one of these formats and reduce the file size.
How to tell it's resolved: the logo appears in the preview.

The card is gray and marked "Not available on your plan"

What this means: the public chat, iFrame, and Widget are included in one plan option, and it is not part of your plan. On the free Free plan, installing the widget and iFrame is not available (Free plan limitations). In the code block, instead of the code, you will see the message "Your plan does not include the widget integration".

How to upgrade to the required plan:

  1. Find out which plan you need: in the Integrations section, hover over the gray card. The tooltip "Upgrade to the plan …" will name the most affordable plan that includes this integration. For how the Free, Basic, Pro and Business plans differ, see how much Binom AI costs.
  2. Open Subscription. If you are on the free plan, click "Choose plan". If you are on a paid plan, click "Compare plans".
  3. Select a plan and a billing period (monthly, every 3 months or annually), then click "Confirm and pay". The payment page will open.
  4. After payment, you will see "Subscription payment successful!". Go back to Integrations → Widget. The card will be marked "Available".

Want to try it first? The 7-day trial includes the features of the Basic plan: how to subscribe or start a trial. If you see "Payment was not completed. Your plan has not changed" after paying, try the payment again or write to support@binomai.com, including your account email and the plan you selected.

More Questions

How do I change the color of the chat button on my website?

On the Integrations → Widget tab, select "Customize appearance separately" and set the colors. If this is not selected, the general chat appearance from the "Branding" tab is used.

Can I add my own logo to the chat?

Yes, in the "Widget logo" field on the Widget tab: PNG, JPEG, WebP or GIF up to 5 MB.

What's Next

Was this article helpful?

Updated October 21, 2026