widget_chat is live on pub.dev — drop-in AI chat for Flutter, FlutterFlow, React & Web. Start free →

widget_chat · live on pub.dev

Ship an AI chat widget.
In any app. Today.

Drop-in AI chat for Flutter, FlutterFlow, React, and the web. One widget_chat package or one <iframe> — fully themed, multilingual, with signed user identity and a no-code dashboard behind it.

Free forever · No credit card · 10-minute setup

<iframe
  src="https://widget-chat.com/embed?key=YOUR_PROJECT_KEY"
  style="position:fixed;bottom:20px;right:20px;border:none;
         width:400px;height:600px;z-index:9999;"
></iframe>
Paste it. Ship it. View on pub.dev →

Built for production

1-line embed 100+ conversation languages 46 UI locales No backend required
On pub.dev Flutter FlutterFlow React Web

Configure everything. Write nothing.

The dashboard is your control plane. Set the assistant's name, avatar, welcome message, brand color and full chat palette, pick any Google Font, and design the floating launcher — no redeploy, no code.

  • Identity & welcome message
  • Full chat color palette
  • Any Google Font
  • Custom floating launcher
  • Read-only mode
  • Sounds & volume per event

Pick a brand color — the preview updates instantly.

AI Assistant

● Online

Hi! How can I help you today?
Show me your pricing.
Type a message…

Messages that do more than talk.

Markdown, image cards, carousels, product lists, tap-to-zoom galleries, button groups, and color-swatch pickers — rendered natively in the chat.

Markdown

Headings, lists, links and code, rendered natively in the bubble.

Image cards

Rich media with titles, captions and tap actions.

Carousels

Swipeable rows of cards for browsing options.

Product lists

Structured items with price, image and a call to action.

Galleries

Tap any image to zoom in full screen.

Swatch pickers & button groups

Let visitors choose a color or pick a quick reply.

It doesn't just answer. It acts.

Register custom HTTP tools the bot calls mid-conversation. Fire host-page callbacks and deep links — open a page, add to cart, open a modal. Let visitors attach photos from camera or gallery, auto-resized and uploaded.

tool.json
{
  "name": "check_order_status",
  "description": "Look up an order by id",
  "method": "GET",
  "url": "https://api.yourshop.com/orders/{id}",
  "parameters": {
    "id": { "type": "string" }
  }
}

Host-page actions

The bot can trigger callbacks your app listens for — drive navigation, commerce, and UI from inside the conversation.

open page add to cart open modal open URL send message request input photo attachments
Security

Identity you can verify. Origins you control.

Authenticate real users with server-side HMAC-signed IDs, then flip on require-verification to reject anything unsigned. Lock requests to your domains with allowed-origins, and keep user IDs pseudonymized with hashing.

server.js
import { createHmac } from 'crypto';

// Sign the user id with your Identity Secret — server-side only.
const signature = createHmac('sha256', process.env.WIDGET_CHAT_SECRET)
  .update(userId)
  .digest('hex');

// Pass userId + signature to the widget. The secret never ships.

HMAC Identity Secret

Sign user IDs server-side; the widget never sees your secret.

Require verification

Reject unsigned identities with one toggle.

Allowed origins (CORS)

Only your domains can talk to your project.

Public project key

Safe to ship in client code.

Hashed user IDs

Pseudonymized by default.

AI-disclosure & data-reuse

Optional one-time acknowledgements.

Speak your visitors' language. Literally.

The bot converses in 100+ languages via dynamic AI translation; the chat UI ships translated in 46 locales, with an in-chat language switch and optional auto-detect — and you can localize content per locale.

100+

bot conversation languages

46

translated UI locales

Auto-detect

+ live switch

Hi! How can I help you today?
Do you ship internationally?
Type a message…

From zero to shipped in three steps.

1

Create a project

Configure identity, palette, languages, and tools in the dashboard.

2

Embed the widget

Add the widget_chat package or one <iframe> / script tag.

3

Sign your users (optional)

Add HMAC identity for verified, personalized chats.

Your appwidget_chat / iframeWidget-Chat APIyour tools & dashboard config

Built to be operated responsibly.

Visitors rate responses Good or Bad; you triage them in a dashboard Reports view. Read conversation analytics and full API/tool-call logs. Offer users data export and clear. Show AI-disclosure and data-reuse notices when you need them.

Moderation reports Conversation analytics API & tool-call logs User export / clear Pseudonymized IDs

Reports

Helped me find the right plan in seconds.

Didn’t understand my refund question.

Quick, accurate answer about shipping.

Pricing

Start free. Upgrade when it ships.

Free Forever plan, no credit card. Paid tiers when you scale.

Get started for free →

No credit card required. Cancel anytime.

Is there really a free plan?

Yes — a Free Forever plan with no credit card required, plus paid tiers as you scale.

Do I need a credit card to start?

No. You can create a project and embed the widget on the Free Forever plan without entering any payment details. Add a card only when you choose to move to a paid tier.

What do I get on the free plan?

A drop-in AI chat widget you can embed in Flutter, FlutterFlow, React, or any web app, configured from the no-code dashboard — identity, theme, 46 UI locales, and 100+ conversation languages included.

Can I cancel anytime?

Yes. Paid tiers are month-to-month and you can cancel at any time; you keep access until the end of your billing period and can return to the Free Forever plan.

FAQ

Frequently asked questions

Everything you need to know about Widget-Chat. Still stuck? Email our team.

Still have questions?

Our team is here to help. Get in touch and we'll respond as soon as possible.

Your chat widget is eight lines away.

Create a free project, paste the snippet, ship.