Persona.js logo

Persona.js.

既存サイトにAIアシスタントを数行で追加

フロントエンドに簡単導入可能なオープンソースAIチャットUI。WebMCP対応でツール連携も可能。React不要、軽量設計。

週間ランキング
▲ #33
投票数
191
対応プラットフォーム
Web / Mobile
リリース日
Recently
Persona.js screenshot

Persona.jsについてもっと知る

Persona.js:オープンソースのエージェントUIライブラリ

Persona.jsは、純粋なJavaScriptで構築された軽量かつ拡張性の高いエージェントUIライブラリです。フレームワークに依存せず、あらゆるスタックとSSEバックエンドで動作し、WebMCP標準にネイティブ対応しています。数行のコードで、フローィング、ドッキング、フルスクリーンなど多彩なレイアウトのAIエージェント体験をアプリケーションに組み込むことができます。

製品の主な特徴

  • 軽量なVanillaJS実装: フレームワーク不要で、どんな既存プロジェクトにも容易に統合可能です
  • Shadow DOMによるスタイル分離: ホストページのCSSと完全に分離され、どんなデザインシステムでも安全に埋め込めます
  • 柔軟なレイアウトオプション: launcher設定の変更だけで、コーナー配置のフローティングパネル、サイドドッキングのコパイロット、フルスクリーンアシスタントを切り替えられます
  • WebMCP標準対応: ページ上の既存機能(検索、カート、予約、フォームなど)をWebMCPツールとして公開し、エージェントが直接操作できるようになります
  • カスタマイズ可能なテーマ: 3層のトークン構造(パレット、セマンティック、コンポーネント)により、ライブエディタを使ってブランドに合わせた見た目に調整できます

活用シーン

  • カスタマーサポート・ドキュメント: フローィングウィジェットとして配置し、ユーザーが必要な時にすぐにAIアシスタントにアクセスできる環境を構築します
  • 業務アプリケーションの自動化: WebMCPツールを活用し、在庫検索、予約管理、フォーム入力などの業務ワークフローを自然言語で操作できるようにします
  • 多言語・多スタック開発: Vercel AI SDK、OpenAI Agents、LangGraph.js、Hono、Express、SvelteKitなど豊富な統合例から、使用している技術スタックに最適な導入パスを選択できます

対象ユーザー

フレームワークに依存せず、既存のアプリケーションにAIエージェント機能を迅速かつ安全に統合したいフロントエンド開発者やプロダクトチーム向けです。特に、WebMCP標準を活用してエージェントとWebページの双方向通信を実現したい組織に最適です。