For AI agents
PATTTTERNS MCP Server
Use the Model Context Protocol to search and browse our curated library of UX and UI design patterns from Cursor, Claude Desktop, or any MCP-compatible client.
Quick setup
Add PATTTTERNS to your MCP client config. Streamable HTTP transport, spec 2025-03-26.
{
"mcpServers": {
"patttterns": {
"url": "https://patttterns.com/mcp"
}
}
}After connecting: initialize → tools/list → tools/call.
Available tools
| Tool | Description |
|---|---|
| search_patterns | Keyword search; returns metadata, tags, pattern_id |
| get_pattern | One pattern by URL slug |
| list_categories | Categories with URLs and pattern counts |
| search_components | Find patterns with fetchable React/TSX (+ tags) |
| get_component | Exact versioned TSX; default = active/last generation |
Use get_component with a catalog number (#413), UUID, or slug. Omit version_id for the most polished (active) version, or pass v1 to pin an iteration. Component payloads include pattern tags and required --ui-* CSS variables.
Example: get a component
POST https://patttterns.com/mcp
Content-Type: application/json
{
"jsonrpc": "2.0",
"id": 1,
"method": "tools/call",
"params": {
"name": "get_component",
"arguments": { "pattern_id": "#413" }
}
}Parse result.content[0].text as JSON for metadata, usage_rules, component_code, and resource.
Machine discovery
Agents can auto-discover the server without this page:
- MCP catalog — /.well-known/mcp/catalog.json
- Server card — /mcp/server-card
- LLM manifest — /llms.txt
- Agent skills — /.well-known/agent-skills/
Coming later: an auth wall (Supabase + Google SSO, then MCP tokens / OAuth) for library saves and gated premium components. Public component fetch is available now for adoption. See our about page for product updates.