📡 MCP Radar

donaldrichard19-LVD/pattern-mcp

Pattern MCP helps coding agents make better UI decisions. It checks real components from shadcn/ui and 21st.dev against what the product needs. If nothing fits, Pattern finds a real reference from Mob

3 stars
0 forks
TypeScript
momentum ▲ 5.0
created 2026-08-24
on radar since 2026-08-29
aiai-agentsai-agents-mcpdesigndesign-patternsdesign-systemsmcpmcp-serverui-componentsui-designui-library
View on GitHub ↗Homepage ↗

About pattern-mcp

Pattern is an MCP server that helps coding agents make better UI component decisions.

See Quick Start below to add your Anthropic API key and connect Pattern to your MCP client.

Instead of returning a list of search results, Pattern looks at what you need, checks real components against that need, and tells the agent whether to:

- Use an existing component from shadcn/ui, 21st.dev, or ReUI - Build a custom component, using a real product reference from Mobbin and/or Figma Community

Pattern is designed for agents to use while they are building.

- recommendcomponent — evaluates a UI component need and returns a structured recommendation. - extractrequirements — runs just the requirement-extraction step on its own, so you can inspect or hand-edit the checklist before recommendcomponent spends its search+score budget on it. - recordcomponentdecision — records what the agent actually did so future recommendations in the same project can take that decision into account.

For each recommendcomponent call, Pattern:

1. Checks whether the need is a simple primitive that doesn't require a search. 2. Turns the request into a set of specific requirements, unless a checklist was already supplied (see checklist). 3. Searches for matching shadcn/ui, 21st.dev, and ReUI components. 4. Checks each candidate against the requirements using evidence from the actual component. 5. Calculates how much of the requirement is covered. 6. Decides whether to use an existing component or build a custom one. 7. If a custom build is needed, searches Mobbin and Figma Community for real product example

From the project README.

Maintaining this server?

Add the radar badge to your README — it shows your project was picked up by MCP Radar and links to this page:

[![On MCP Radar](https://mcp.liqiwa.com/badge.svg)](https://mcp.liqiwa.com/s/donaldrichard19-LVD--pattern-mcp.html)

Related MCP servers

mkpoli/gmail-mcp

Multi-account Gmail MCP server on Cloudflare Workers — one deployment, one Google sign-in per connection, any MCP client

⭐ 5TypeScript
slxca/opencontext

A Model Context Protocol server for persistent project-specific AI agent context.

⭐ 5TypeScript
metahub-ai/assay

An open, reproducible trust layer for AI artifacts — skills, MCP servers, agents, and plugins. Assay inspects code, runs sandboxed behavioral audits, and generates verifiable reports. Help us build th

⭐ 4TypeScript
syoooo/figma-relai

Your AI, on the canvas — connect Claude Code, Cursor, or any MCP client to Figma: read, edit, audit, build. The file itself carries your rules and rulings. Works on every Figma plan.

⭐ 3TypeScript
thatcreativetayo/kromamcp

Zero-database, internet-connected MCP server for live design intelligence and UI component synthesis.

⭐ 3TypeScript
balatD/typo3-dev-mcp

MCP server for TYPO3 v13/v14 development — gives AI assistants like Claude Code live insight into TCA, database schema, sites, TypoScript, logs and the core changelog.

⭐ 4PHP

📬 Get the weekly radar in your inbox

The top new MCP servers of the week, every Monday. No spam, unsubscribe anytime.