AI Chatbot Interface

Bolt.new prompt for an AI chatbot interface with streaming responses, markdown rendering, and conversation management.

boltchatbotaiinterface

Prompt

Build an AI chatbot interface similar to ChatGPT:

## Chat Interface
- Message bubbles: user messages right-aligned, AI responses left-aligned
- Markdown rendering in AI responses (code blocks, lists, bold, links)
- Code blocks with syntax highlighting and copy button
- Streaming text animation (words appearing progressively)
- Auto-scroll to latest message

## Input Area
- Expandable textarea that grows with content
- Send button and keyboard shortcut (Cmd+Enter)
- File attachment button (for images/documents)
- Character count indicator
- Disable send while AI is responding

## Sidebar
- Conversation history list
- New chat button
- Search conversations
- Delete and rename conversations
- Collapse sidebar on mobile

## Features
- Dark/light mode toggle
- Model selector dropdown
- System prompt editor (collapsible settings)
- Export conversation as markdown
- Regenerate last response button
- Stop generating button

Use React + TypeScript + Tailwind. Clean, minimal design. Responsive with mobile-optimized layout.

Save this prompt to your library

Organize, version, and access your best prompts across ChatGPT, Claude, and Cursor.

Related prompts

Landing Page Generator

A Bolt.new prompt that generates a complete landing page with hero, features, pricing, and FAQ sections.

SaaS Dashboard with Auth

Bolt.new prompt for a complete SaaS dashboard with authentication, team management, and analytics.

Real-time Chat Application

Bolt.new prompt for a real-time chat app with group messaging, typing indicators, and reactions.

E-Commerce Product Page

Bolt.new prompt for a product page with image gallery, variant selectors, reviews, and mobile optimization.