C

ui.inference.shから提供される、ReactおよびNext.jsアプリケーション向けのチャットUI構築ブロック。

Chat UI

チャットコンテナ、メッセージ、入力欄、タイピングインジケーターなどのReactおよびNext.jsコンポーネントを使用して、カスタムチャットUI、メッセージングインターフェース、AIアシスタントを構築します。

UIデザイン
709 スター96 フォーク2026年8月24日 更新済みソースを表示

スキルのインパクト

測定可能な価値を持つフォーカスされたワークフロー。

スター

709

フォーク

96

更新済み

2026年8月24日

Chat UI について

Chat UI building blocks for React/Next.js from ui.inference.sh. Components: container, messages, input, typing indicators, avatars. Capabilities: chat interfaces, message lists, input handling, streaming. Use for: building custom chat UIs, messaging interfaces, AI assistants. Triggers: chat ui, chat component, message list, chat input, shadcn chat, react chat, chat interface, messaging ui, conversation ui, chat building blocks

Chat UI でできること

コンテナ、メッセージ要素、入力、タイピングインジケーターを含む React および Next.js のチャットコンポーネントを提供し、カスタムの会話型インターフェイスや AI アシスタントのメッセージング画面を構築します。

ユーザー、アシスタント、システムメッセージの役割を持つチャットメッセージリストをレンダリングします
送信処理と無効化状態を備えたユーザー入力メッセージをキャプチャします
読み込みおよび生成フェーズ中にタイピングインジケーターを表示します
Tailwind CSS と shadcn/ui デザイン トークンを使用してチャット コンポーネントをスタイリングします

一般的なユースケース

01

Web アプリケーション用のカスタムチャットインターフェイスの構築

02

会話型 AI アシスタントのメッセージング画面の開発

03

リアルタイムメッセージングのビルディングブロックを React プロジェクトに統合する

04

Tailwind CSS とデザイン トークンを使用したチャット コンポーネントのスタイリング

クイックスタート

インストールコマンド

npx skills add inference-sh/skills@chat-ui

タグ

トピックと機能

#UI モックアップ#ウェブサイトのモックアップ