• All Services

    As a HubSpot Partner Agency, Market Veep is committed to helping our clients reach the right people at the right time through a wide range of digital marketing channels.

  • Onboarding

    Get a faster time-to-start with pro onboarding solutions from HubSpot Certified Trainers

  • Integrations

    From Salesforce to Zoho, expertly integrate your sales and marketing systems

  • Migrations

    Move off of Pardot, Pipedrive, and other systems into your shiny new HubSpot portal

  • Blog

    A collection of marketing, sales, and HubSpot knowledge - with a look inside of the culture here at Market Veep.

  • Ebooks

    Regardless of the industry that you’re in, we’ve got an ebook full of fresh and actionable marketing insights to help catapult your brand to continued success.

  • Events

    Join us for our upcoming events and webinars or download recordings of previous events, webinars, podcasts, and more.

  • Case Studies

    Browse our case studies to see the real results we've achieved for real clients, just like you.

The 14 Secrets to an Engaging Live Chat Window Design

The 14 Secrets to an Engaging Live Chat Window Design

Chances are a lot of time and care went into your website design. Is the same true for your chat window design? Here are 14 tips for creating an engaging live chat window that will entice website visitors to get in touch with your customer service reps.

Live chat for business is the most up-and-coming channel for customer support, sales, marketing, and beyond. A well-designed live chat window can help increase user engagement on your website by offering an optimized channel for near-instant communication.

Here are 14 tips for creating an engaging live chat window for your company’s website:

1) Use Branded Colors

Your chat window should look consistent with the rest of your website. Using branded colors is a great way to maintain your brand’s look and feel in your chat window design.

For example, look at how Home Depot’s chat window design mirrors the color scheme and general aesthetic of the rest of their website. Not only does the chat window hide on the edge of the page (seen in the left image), but when it opens up, it feels like an appropriate and natural extension of their website's brand aesthetic.

2) Add a Background

Adding a background to your chat window is another way to maintain branding consistency on your live chat window design.

Just make sure that the background you choose doesn’t make it hard to read the text. Like you can see in the example above and below, the live chat window design includes a background so you can easily see the text without messing up the overall consistency of the web page.

The 14 Secrets to an Engaging Live Chat Window Design
Featured Image Bottom Icon

3) Introduce Yourself

Add a photo and a personalized introduction, so users know they are chatting with a live person. If you’re using a chatbot, it should be clear that it’s a bot, not a human. 


(Market Veep)

Adding a profile picture is a great way to show your audience that they’re talking to a human representative, which can make it easier for visitors to introduce themselves. 

4) Use a Personalized Greeting

Live chat software allows you to choose who will see your chat window. You can use these settings to customize your messages based on user behavior.


For example, you could show a different message for new vs. returning visitors, like Drift does in the examples above. By acknowledging that you've visited their site before, they're reinforcing a relationship that makes it easier for website visitors to initiate a conversation.

5) Show Chat History

Users may want to view their chat history with you for a variety of reasons, so this feature may prove helpful for more than a few of your live chat users.



Inbound marketing is all about providing the customer with the services and information they need when they need it. So, cataloging your live chat conversations and then allowing your visitors to access their own can be a great way to address a need they may not know they had.

6) Ask a Question

Asking an open-ended question is a great way to start a conversation over live chat. You can even customize the questions asked in your live chat window based on the specific page a user is viewing.

live chat window design - NYT

(The New York Times)

7) Show a Reply or Queue Time

Showing your reply time or queue time can help set a user’s expectations around when you’ll respond to them. Take note of the "Chat live now" wording on the live chat box in the bottom-right corner of the image below:


If you click on the window, it opens up and will give you a more precise timeline for when you can expect to speak to a live chat representative.

This is good design, because if someone is expecting an immediate response but don’t know that it could take up to 10 minutes for someone to answer, they’ll likely drop out of the conversation before you get there. This way, the visitor knows that someone will be along shortly (and in the case of this particular example, someone was available almost immediately).



8) Use an Away Message

During times when someone is unavailable to chat, an away message is an easy way to keep your live chat window running without disappointing your users. Remember to let them know when and how you respond to them (via email, etc.) as well as when the live chat will return.

live chat window design - olark


9) Integrate Your Knowledge Base

Many users are looking for quick answers to simple questions. As shown in the HubSpot live chat example below, integrating your knowledge base with your chat software allows users to find answers to FAQs right within your chat window quickly.

live chat window design - hubspot


10) Try Different Placements

While most sites opt to put the chat window in the bottom right corner of the page, you can try out different placements to see if there’s one that makes more sense for your website. Some other options are the bottom left corner, the sides (like the example below), or even the top.


It's worth noting, however, that the window will still open at the bottom of the page (or in a new tab entirely, but more on that in a moment). 


(Auto Accessories Garage)

11) Show Your Brand’s Personality

In addition to matching the look and feel of your brand, a chat window should also capture your brand's personality. Whether that means being very serious and professional or being playful and punny, you can convey your brand image through your chat window.

Just look at how the site below gives their live chat window a fun name to match the tone of their site!


A cute mascot like this can go a long way toward aligning your live chat services with your overall brand identity. Especially if they're as helpful and accommodating as Kinguin's "MIL0." 



12) Segment New and Existing Customers

For many businesses, the live chat path will look different for a new customer vs. an existing customer. Asking this question upfront allows your current customers to enter their account information for faster, more personalized help. It also allows new customers to be routed directly to sales.

live chat window design - comcast


13) Open Chat in a New Window

One of the struggles with live chat is that if your user leaves or closes the window, they might miss your responses, and you might miss your chance at a sale. Opening the chat window in a new window can help prevent your tab from getting lost in the shuffle. 

LIVE CHAT WINDOW DESIGN - NISSANNotice how Nissan USA's website has its "Live Chat" at the top of the page, but when you click on it, it opens up a brand new tab so you can keep your conversation in one place, no matter where else you end up.



14) Provide Fast Links

If you find that users are chatting in for the same things repeatedly, you could benefit from providing some quick link options in your chat window. These options can lead users down different paths to address their specific concerns.

Live Chat Window Design - honest company

(The Honest Company)

Ready to Launch Your Live Chat?

Now that you have an idea of what your live chat window can look like, check out these 4 live chat best practices to get your own live chat up and running!


What is a Live Chat Window?

Before we jump into the intricacies of chat window design, let’s take a moment to make sure we’re all on the same page about what a chat window is. A live chat window is an online tool that allows customers to interact with a human customer service rep via online messaging.

Unlike chatbot windows, the beauty of the live chat design is that customers can interact with human reps in much the same way as they would over the phone or in-person. Don’t get us wrong - chatbots can be helpful for answering quick and easy questions.

But when it comes to more specific questions, interacting with another human can significantly speed up the quest for answers. From a customer’s point of view, live chat boxes are a quick and convenient path to customer service, with no need to jump on the phone.

Benefits of Adding a Live Chat Window on Your Website

We’ve all been there. You call a helpline, only to spend more time listening to bad “please hold” music than speaking to a representative. Adding a customized chat window to your website can help ensure it never happens to your customers again.

Live chat windows can also help reduce your overall Average Handle Time (AHT), as representatives can also often handle multiple chats at once and use automated answers to answer frequently asked questions. Many live chat website designs also offer the ability to store past conversations and notes to provide context on each user quickly.

Some studies even show that customers who engage in web chats are more likely to convert, not to mention spend 60% more when they do. Not a bad deal, considering that it’s possible to get started for free with tools like HubSpot’s Live Chat Software.

Difference Between Embedded Chat Window and Pop-Up Chat Window

As you search for live chat design inspiration, don’t forget to address one of the most fundamental questions of all - embedded chat or pop-up chat? While similar, there are a few things that set the two options apart.

Embedded chat windows are built into your web page and usually invite users to engage by clicking a prompt that floats near the bottom left corner of each screen. As long as you include a minimize option, they tend to be unobtrusive and can be accessed from any page of your site.

Pop up chat windows “pop up” over a user’s screen in their own separate tab. They can be a handy way to invite users to interact but should be used strategically to avoid becoming annoying. One of their benefits is that users can continue a chat even if they navigate away from your website.

There are no right or wrong answers when it comes to choosing which to use. The best choice will largely come down to your goals and target audience.

Get The Latest From
Market Veep


Get Growing! 

Download our eBook and get advice from 8 CEOs of  Inc. 5000 companies in their own words.



Market Veep is a great firm that handles all of our marketing efforts. This is the second time that I have used the firm. I highly recommend Market Veep!

Cres F.



Market Veep's Onboarding Experts in Inbound Marketing are an absolute game-changer! From the get-go, their approach was top-notch. Market Veep's team has undoubtedly set the bar high for excellence in inbound marketing. Five stars aren't enough to commend their outstanding service!

Matthew W.



As a growing business, setting up our first-ever HubSpot account was a crucial step towards enhancing our marketing and customer management strategies. From the moment we contacted MarketVeep, their team demonstrated professionalism, expertise, and a genuine desire to help us succeed. Overall, our experience with MarketVeep was exceptional, and we couldn't be happier with the results. Thanks to their guidance, we are now utilizing HubSpot to its fullest potential, streamlining our marketing efforts, and nurturing leads more effectively.

Jean M.



We had an exceptional experience with Market Veep! Their team is professional, super organized, and friendly, and I truly enjoyed working with them. They executed on time and made the process super easy with their organization and documentation. In addition, they provided additional guidance and answered my many questions as I was new to HubSpot, and provided documentation resources for future use. We're now set up to leverage all that HubSpot marketing has to offer, and we couldn't have done it without Market Veep's expertise.

Bailey G.



There aren't enough words to describe the outstanding, professional work MarketVeep has provided to our company. From start to finish, the website design/development team at MarketVeep assigned to our project was extremely knowledgable, respectful, efficient and timely. The results went above and beyond our expectations and we could not be more thrilled with the improvements to the user experience on our website! Bravo MarketVeep, we'll absolutely be back with more projects!

Nadine B.



We had a fantastic experience with Market Veep! Their expert team seamlessly guided us through implementing HubSpot and provided comprehensive training across Sales, Service, and Marketing Hubs. Their knowledge and support significantly enhanced our workflow and overall efficiency. Highly recommend Market Veep for top-notch HubSpot solutions!

Anneke C.