Open Source AI Chat Widget

Add a streaming AI chat
to any website, in minutes.

Themeable, pluggable, zero framework dependencies. Style isolation, SSE streaming, agent loops, and tool use — all in one drop-in widget.

Style Isolation SSE Streaming Agent Loops Theming Voice Input Vanilla JS
npm GitHub Ask DeepWiki
Built by
Live Demo

Try it live

Ask Persona anything — or pick a suggestion below to explore.

Quick Start

Choose your integration path

Ship to prod with Runtype in minutes, or wire Persona into your own SSE backend.

01

Run the CLI setup

Create an agent, mint a client token, and get a paste-ready installer snippet.

Sign in when prompted — the CLI reveals your token and lets you copy the snippet.

02

Paste the installer snippet

Use the default script installer when you want the fastest path to a live widget.

<script
  src="https://cdn.jsdelivr.net/npm/@runtypelabs/persona@latest/dist/install.global.js"
  data-runtype-token="ct_test_..."
></script>

The widget mounts on body by default. Need a specific container? Pass --target-selector "#chat" and the CLI will include a mount div and data-config in the snippet.

Need server-side flow control? Use @runtypelabs/persona-proxy.

persona init --help 
Usage
  $ npx @runtypelabs/cli@latest persona init [options]

Description
  Create agent + client token and output a Persona embed snippet.

Options
  --agent-name <name>         Name for the new agent
  --agent-description <text>  Optional agent description
  --token-name <name>         Custom name for the client token
  --environment <env>         test or live (default: test)
  --origins <origins...>     Allowed origins (default: *)
  --format <fmt>             script-installer | script-manual | esm | react
                              (default: script-installer)
  --print-snippet             Print the snippet to stdout
  --target-selector <sel>    Widget mount target (default: body)
  --api-url <url>            Override API base URL
  --json                      Structured JSON output (includes snippet)
  --yes                       Accept defaults without prompting
  --tty / --no-tty            Force interactive or non-interactive mode

Examples
  # Interactive — just run it
  $ npx @runtypelabs/cli@latest persona init

  # Non-interactive for CI
  $ RUNTYPE_API_KEY=sk_... npx @runtypelabs/cli@latest persona init \
      --agent-name "Support" --no-tty --json

  # ESM snippet for a bundled app
  $ npx @runtypelabs/cli@latest persona init --format esm
Customization

Theme Editor

Customize every color, font, and layout token — then copy the config straight into your project.

Open Theme Editor →
Demos

See what Persona can do

Explore different use cases across full-page layouts, embedded contexts, and business scenarios.

More

Advanced examples

Configuration patterns, plugin hooks, and integration recipes — agent loops, tool approval, dynamic forms, voice, artifacts, and more.

Browse advanced examples Standalone script samples