Product update · Setup

Your chatbot picks up your logo and colours from your website

Give Studio your website and it brings in your brand colour, logo and header image, so your chat window matches your site without any design work.

Gopi Krishna Lakkepuram

· 3 min read

Shipped
Area
Setup
Available on
Every plan

A chat window in default blue looks like someone else's product sitting on your website. Matching it to your brand meant finding your hex codes, downloading your logo and uploading it in the right size. Now Studio does that from your web address, both when you create a chatbot and any time later from the designer.

What's new

When you create a chatbot with quick start, Studio reads the website you enter and applies:

  • Your brand colour to the chat button, header, buttons and your visitors' message bubbles, with text colours picked to stay readable on top of it.
  • Your logo as the chat header logo and the AI's avatar. Studio prefers your square icon over a wide wordmark, because the header shows the logo in a circle.
  • A header background image, when your site has one.

If your site has no usable logo, or only a tiny one, Studio makes a clean avatar from your business's initials in your brand colour instead of showing a blurry icon.

Imported images are copied to Hyperleap. Studio saves its own copy, so your chat window doesn't depend on your website's files and keeps its look if you redesign your site.

If you started on hyperleap.ai, the website you typed there is already filled in when you sign up and open quick start.

How to use it

To import your brand into an existing chatbot:

  1. Open your chatbot in Studio and go to the Design tab.
  2. Click Import Brand, enter your domain (for example yourcompany.com) and click Fetch Brand.
  3. Review the current and new values side by side. Choose what to apply: Apply Brand Colors, Apply Logo, Apply Bot Avatar and Apply Header Background.
  4. Click Confirm & Apply Changes, check the preview, and publish when you're happy.

Good to know

  • Nothing goes live until you publish. Imported styles land in your draft, like any other design change.
  • You choose what to keep. Each part of the import can be switched off before you apply it, and you can change any colour or image by hand afterwards in the Design tab.
  • Some sites don't share much. If a site hides its logo or colours, Studio applies what it can find. You can always upload your own logo.
  • Quick start does more than branding. It also reads your site to draft a starting prompt. Your chatbot answers from the sources you connect, so add your key pages and documents before you go live.

Explore Hyperleap AI

An AI front desk that answers customer questions, collects contact details, and books appointments on your website and messaging channels.