👋 This is a community-driven shadcn/ui resource. For the official documentation, visit ui.shadcn.com
AI Prompt Input
An AI chat input with expandable textarea, voice recording, file attachments, and contextual action menu
Looking to implement shadcn/ui blocks?
Join our Discord community for help from other developers.
Building AI chat interfaces? This React prompt input adapts as users type—compact for quick questions, expanding for longer prompts. Built with shadcn/ui and Tabler Icons, it features microphone for voice input, paperclip for file attachments, and dropdown menu with Agent mode and Deep Research options. The textarea auto-resizes based on content length, maintaining smooth transitions between states while keeping the interface clean and focused on the conversation.
Installation
npx shadcn@latest add https://www.shadcn.io/registry/ai-prompt-input-01.jsonnpx shadcn@latest add https://www.shadcn.io/registry/ai-prompt-input-01.jsonpnpm dlx shadcn@latest add https://www.shadcn.io/registry/ai-prompt-input-01.jsonbunx shadcn@latest add https://www.shadcn.io/registry/ai-prompt-input-01.jsonRelated blocks you will also like
AI Conversation
Chat message thread with responses
AI Message
Individual chat message component
AI Response
AI assistant response with formatting
AI Code Block
Syntax-highlighted code in chat
AI Loader
Thinking/processing animation
AI Suggestions
Quick action suggestion chips