Tawk.to integration

Customize the Tawk.to chat button with an animated character

Swap the plain Tawk.to bubble for a character in your brand colors. Opens your Tawk.to chat.

Can you change the Tawk.to chat icon?

Partly. Tawk.to lets you set the widget's colors, pick one of six positions (separately on desktop and mobile), hide it on mobile, and show an image in its Attention Grabber next to the button. Changing the button's own icon isn't clearly documented, and there's no animated launcher.

What Tawk.to lets you change

  • Change the widget colors
  • Pick one of six positions, separately for desktop and mobile
  • Hide on mobile or on load
  • Hide it and open the chat from your own button (Tawk_API.hideWidget() and maximize())

What it doesn't

  • Animate the button or use a character
  • Show the Attention Grabber image on mobile or while you're offline

Source: tawk.to Help: chat widget appearance, checked 2026-10-18. More tools compared in how to customize your website's chat button.

Add an animated character to Tawk.to, step by step

  1. Create a free Chatmello account and enter your website address.
  2. Pick a character (or upload your own mascot), your brand colors, a personality and a greeting.
  3. Publish, then paste your snippet before </body> on every page, next to your Tawk.to code. It looks like this:
    <script src="https://www.chatmello.com/chatmello.js" data-site="YOUR-SITE-ID" async></script>
  4. Open your website. Your pet finds Tawk.to on the page by itself and takes over its button. The dashboard shows "Found Tawk.to on your site".
  • Keep your tawk.to code (embed.tawk.to) on the page.

How the pet works with Tawk.to

  • Chatmello hides the tawk.to widget while the pet is showing and brings it back if the pet can't work.
  • Clicking the pet opens the tawk.to chat.
  • Chatmello counts your team's messages that arrive while the chat is closed and shows them on the pet.

What stays the same

  • Your Tawk.to account, inbox, team and routing
  • Your bots, automations and office hours
  • The Tawk.to chat window your visitors see
  • If Tawk.to fails to load or open, the pet steps aside and the normal Tawk.to button comes back

Performance and accessibility

  • The Chatmello script is about 12 KB (gzipped), loads after your page and downloads only the character you use.
  • No cookies, and it never records what visitors type.
  • The pet is a real button with a label, works with the keyboard, and keeps still for visitors who ask for reduced motion.

Troubleshooting

The tawk.to bubble still shows
Check that the tawk.to code loads on the same pages as Chatmello, then hard-refresh. If tawk.to takes more than about 15 seconds to start, the pet steps aside.
I use tawk.to's Attention Grabber
It belongs to tawk.to's own button, which is hidden. Use Chatmello's greeting bubble instead.
The pet doesn't appear
Check the website address in your Chatmello settings and that your design is published.

What visitors get

  • A friendly character instead of a plain bubble
  • A greeting bubble with your message
  • The Tawk.to chat opens when they click the pet
  • Unread messages shown on the pet while the chat is closed

Questions

Does it work with tawk.to's free plan?

Yes. tawk.to is free, and Chatmello's free plan covers one website.

Can I change the tawk.to chat icon without Chatmello?

tawk.to documents colors, positions and an Attention Grabber image next to the button, but not replacing the button's icon.

Do my tawk.to agents and triggers still work?

Yes. Chatmello only replaces the button; everything inside the tawk.to chat stays the same.

Will visitors see unread messages?

Yes. Chatmello counts messages from your team that arrive while the chat is closed and shows them on the pet.

Can the pet replace the Attention Grabber?

Yes, in effect: Chatmello's greeting bubble shows your message next to the pet, after a delay you choose.

Can I show the pet on some pages only?

Yes. In Chatmello's settings, show it only on pages you list, or everywhere except some.

Will it slow down my website?

No. The script is about 12 KB, loads in the background, and only fetches the files your pet needs.

Is there a free plan?

Yes: one website, every character and every chat tool, free forever.

Give Tawk.to a face

Free for one website. Pick a character, choose your colors, paste one line of code.

Create your pet free