# AI Patterns

> A pattern library for AI product UI — tool approval, confidence indicators, agent handoff, error recovery, streaming answers and more. Each pattern is a UX spec (when to use, anatomy, behavior, content, accessibility) plus a copy-paste React implementation (Next.js, TypeScript, Tailwind v4, Motion, Radix).

The interactions in AI products that don't have established conventions yet — tool approval, confidence, agent handoff, error recovery, streaming — distilled from shipping products into 71 patterns across 22 categories.

- [Browse the patterns](https://ai-patterns.app/patterns.md)
- [Claude Code skill](https://ai-patterns.app/skill.md)
- [Source on GitHub](https://github.com/carlosmarch/ai-patterns)

## For agents

- [llms.txt](https://ai-patterns.app/llms.txt): this index.
- [llms-full.txt](https://ai-patterns.app/llms-full.txt): every pattern's full spec in one file (code omitted).
- Markdown: append `.md` to any page URL (e.g. `/patterns.md`, `/patterns/buttons/shiny-button.md`).
- JSON API: [`GET /api/patterns`](https://ai-patterns.app/api/patterns) lists every pattern; `GET /api/patterns/<category>/<slug>` returns its spec, source code and npm dependencies.
- MCP server (Streamable HTTP, no auth): `https://ai-patterns.app/mcp` with tools `list_patterns` (filter by category or job), `search_patterns` and `get_pattern`.
- Claude Code skill — recommends and scaffolds patterns into a project:

```
/plugin marketplace add carlosmarch/ai-patterns
/plugin install ai-patterns@ai-patterns
```