AI chat app kit
The screens of a ChatGPT-style app: an AI chat page with conversation history, a streaming thread that stays pinned to the newest message, a prompt composer with attachments and a model picker, and a plan usage meter. Reasoning timers, tool call steps, suggestion chips, voice input and a streaming Markdown renderer cover what the model sends back. For teams putting an assistant or an agent in front of users; the components take your data, so any model API fits behind them.
Install the whole kit
The CLI copies every file into your project as source you own, with the npm packages and the Wingo UI hooks and helpers they need. Pro items need a Pro plan: run npx wingo-ui@latest login once first.
npx wingo-ui@latest add code-block copy-button fluid-orb ai-chat-page chat-thread chat-message prompt-input conversation-list model-picker reasoning-indicator tool-call-timeline suggestion-chips voice-input usage-meter markdownOnly the free part, no account needed:
npx wingo-ui@latest add code-block copy-button fluid-orbThe Pro part
The 12 Pro items in this kit come with Wingo UI Pro, which unlocks all 374 items of the library: $8 a month, $80 a year or $150 once. Open any card to try the item live before you buy.
14-day refund on your first purchase of Pro or Lifetime, as long as you have not downloaded any Pro item yet. Refund policy
Free in this kit[3]
Code Block, Copy Button, Fluid Orb: free for personal and commercial projects, installed without an account under the Wingo UI license.
Code BlockFree
A React code block with syntax highlighting, line numbers, highlighted lines and a copy button, themed from a single accent color.
Copy ButtonFree
A React copy to clipboard button for IBANs, tax IDs, links and API keys: an icon button with a tooltip, a labelled button and CopyText.
Fluid OrbFree
A React WebGL orb with drifting fluid shading for AI voice assistants and ambient loading states, inspired by ChatGPT's voice mode.
Pro in this kit[12]
Every Pro item has a live, configurable preview anyone can open; the source comes with a Pro plan.
AI Chat PagePro
A React AI chat page with conversation history, a streaming thread with reasoning and tool calls, a prompt composer and plan usage.
Chat ThreadPro
A React chat thread for AI chats: the scrolling conversation, pinned to the newest message while it streams, with day pills and follow-ups.
Chat MessagePro
A React AI chat message: the question in a bubble, the answer with its thinking, tool calls, markdown, sources and actions.
Prompt InputPro
A React prompt input for AI chat: a growing text box with attachments, tool chips, a model picker, dictation and a send and stop button.
Conversation ListPro
A React chat history list for AI apps: New chat, search, pinned chats and day groups, with rename, pin, archive and delete.
Model PickerPro
A React AI model picker for chat apps: a quiet trigger that opens a short grouped list of models, each with one line on what it is for.
Reasoning IndicatorPro
A React reasoning indicator for AI chat: a shimmering live timer while the model thinks, then a quiet "Thought for 12 s" row to expand.
Tool Call TimelinePro
A React tool call timeline for AI agents: each step with its status, time, input and output, plus approval and retry when a call needs them.
Suggestion ChipsPro
React suggestion chips for AI chat: prompts people tap instead of typing, as pills under a composer, welcome cards or follow-up rows.
Voice InputPro
A React voice input: a mic that grows into a recording pill with a live waveform and transcript, a full-width bar, or a voice orb.
Usage MeterPro
A React usage meter for plan quotas: tokens, messages, images, credits or money against limits, with resets, warnings and an upgrade offer.
MarkdownPro
A React Markdown renderer in the library's look: scrolling tables, highlighted code, task lists and a flicker-free streaming mode for AI.
More kits
- React SaaS dashboard kitThe admin area of a SaaS or back office: shell, KPI dashboard, users, settings and API keys.
- Next.js ecommerce kitA shop from storefront to checkout and order history, with the product page parts.
- Auth and onboarding kitLogin, sign-up and onboarding screens, plus the inputs and first-run helpers around them.
- Local business website kitWebsites for restaurants, clinics, salons and real estate agents, with booking and maps.
- Agency and portfolio website kitAn agency site and a personal portfolio, plus case study, about, team and testimonial parts.
Or browse all kits, the components and the page templates.