AI SDK Patterns
that compose into apps
23+ open-source, composable AI SDK patterns — chat, agents, tools, workflows. Pick patterns, generate a full-stack Next.js app.
✓ Streaming response readyProvider: anthropic | Model: claude-sonnet-4-5Provider-agnostic — works with any AI SDK provider
Interactive feature showcase
Explore core AI SDK capabilities with animated examples. Click any card to see the actual pattern implementation.
23 patterns, free and composable
Use individually or combine them into one app with the Composer
Streaming Chat
Stream text responses from AI models in real-time using streamText and the useChat hook.
"name": "..."
"score": 42
}
Structured Output
Generate typed, validated JSON data using Zod schemas and the generateObject function.
Tool Calling
Let the AI model call functions and use external tools with the multi-step tool loop.
Generative UI
Render dynamic React components from AI tool calls using streamText and useChat.
Multi-Step Agent
Build an agent that orchestrates multiple tool calls in sequence, using the AI SDK's maxSteps and automatic tool result forwarding.
Web Search Agent
Integrate third-party search APIs (Tavily, Exa) with the AI SDK to build a grounded search agent with source citations.
Human-in-the-Loop
Pause AI execution to get human approval before executing sensitive tool calls. Uses tool confirmation flow with the AI SDK.
RAG Pipeline
Retrieval-Augmented Generation: embed documents, store in a vector database, and retrieve context for grounded AI responses.
JSON Renderer
AI generates structured JSON data that's automatically rendered as interactive visual components — cards, charts, tables, and more.
Markdown Chat
A polished chat interface with rich markdown rendering — code blocks with syntax highlighting, tables, lists, headings, and inline formatting.
Reasoning Display
Show the AI's chain-of-thought reasoning in a collapsible thinking section, then display the final answer — like Claude's extended thinking.
Text Generation
Basic non-streaming text generation with generateText. Submit a topic and get a generated paragraph — the simplest AI SDK pattern.
Image Generation
Generate images from text prompts using generateImage. Enter a description, click generate, and see the AI-created image.
"title": "..."
"tags": [...]
"body": █
}
Streaming Object
Stream structured JSON output in real-time using streamText with Output.object and a Zod schema. Watch a recipe build up field-by-field as the AI generates it.
Code Artifact
AI-powered code generation with syntax highlighting and copy support. Describe what you need, and the AI generates clean, runnable code.
Routing Agent
Routes user queries to specialized sub-agents based on content analysis. A classifier agent determines intent and delegates to the appropriate specialist.
Orchestrator Agent
A parent agent that decomposes complex tasks, delegates subtasks to specialized child agents via tools, and merges their results into a cohesive response.
Evaluator-Optimizer
Generate-evaluate-iterate loop that self-improves output quality. Generates a draft, evaluates it against criteria, and regenerates until the quality threshold is met.
Sequential Workflow
Chain multiple AI calls in sequence, passing the output of one step as input to the next. Implements a research-summarize-translate-format pipeline.
Parallel Workflow
Run multiple AI calls concurrently with Promise.all and merge the results. Performs sentiment analysis, entity extraction, and summarization in parallel.
Chat with Citations
A chat interface that includes inline source citations with expandable source cards. Responses include numbered references that link to source details.
Form Generator
AI generates dynamic forms from natural language descriptions using generateObject with Zod schemas. Describe a form in plain English and get a fully rendered, interactive form.
CSV Editor
AI-assisted tabular data editing. Paste CSV data, ask AI to transform, analyze, or clean it, and see the results in an editable table with AI suggestions.
One pattern or many — your call
Install a single pattern via CLI, or use the Composer to merge several into one integrated Next.js app.
npx shadcn add https://ai-sdk-patterns.vercel.app/r/streaming-chat100% open source — no accounts, no paywalls