pattern-mcp

by donaldrichard19-LVD · Media & Design · ★ 9

pattern-mcp is an MCP server by donaldrichard19-LVD. Pattern checks a coding agent's UI decisions against your own design system before it builds, whether that lives in code or in Figma. It helps the agent reuse what the product already has and build only what is actually missing. An opt-in enforcement boundary can make that check required, and every. It has 9 GitHub stars and ranks #847 of 2017 in Media & Design by stars.

Category: Media & Design
Author: donaldrichard19-LVD
GitHub stars: 9
This week: Tracking since 18 Oct 2026
Weekly downloads: 273
Language: TypeScript
License: MIT (open source)
Last update: 2026-10-22 (2 days ago)
Links: Source Website npm

ai
ai-agents
ai-agents-mcp
design
design-patterns
design-systems
mcp
mcp-server
ui-components
ui-design
ui-library

How to install pattern-mcp

pattern-mcp is published on npm as pattern-mcp, and it depends on @modelcontextprotocol/sdk. These steps assume it runs as a local stdio server, which is the usual setup.

Check the README. Confirm the start command and note any API keys or environment variables it needs (pass them with -e KEY=value or an env block). You need Node.js for npx.

Add it to Claude Code from a terminal:

claude mcp add pattern-mcp -- npx -y pattern-mcp

Or add it to Cursor or Claude Desktop in .cursor/mcp.json or claude_desktop_config.json:

{
  "mcpServers": {
    "pattern-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "pattern-mcp"
      ]
    }
  }
}

Restart the client and check it. Run claude mcp list, or open the client's MCP settings, and confirm pattern-mcp and its tools are listed. The install guide covers VS Code and Codex.

Also listed in

MCP servers for Figma68

Maintain this project? Get it featured ($99/mo, pinned at the top of Media & Design) or see what featuring includes.

Report a problem with this listing

Frequently asked questions

What is pattern-mcp?

pattern-mcp is an MCP server by donaldrichard19-LVD in the Media & Design category. Pattern checks a coding agent's UI decisions against your own design system before it builds, whether that lives in code or in Figma. It helps the agent reuse what the product already has and... It has 9 GitHub stars and ranks #847 of 2017 in Media & Design by stars.

Is pattern-mcp free and open source?

Yes. pattern-mcp is published under the MIT license, so you can run, modify and self-host it at no cost. If it connects to a paid service, that service's own pricing and API terms still apply. Check the repository for the exact license text before using it commercially.

What are the alternatives to pattern-mcp?

Other Media & Design projects on MCP Harbor include Shotkiln, remotion, LocalAI. Each alternative links to its own page with stars, license and recent activity. The Media & Design category ranks all 2017 by stars, and you can re-sort it by growth this week.

Alternatives to pattern-mcp

Shotkiln★ FeaturedMCP Registry

shotkiln.com

Screenshot, PDF and Open Graph image API for AI agents: capture pages, render PDFs, make OG images.

remotion★ 66,837

remotion-dev · TypeScript

🎥 Make videos programmatically with React

LocalAI★ 49,903

mudler · Go+305 stars this week (+0.6%)

LocalAI is the open-source AI engine. Run any model - LLMs, vision, voice, image, video - on any hardware. No GPU required.

chakra-ui★ 40,702

chakra-ui · TypeScript

Chakra UI is a component system for building SaaS products with speed ⚡️

next-ai-draw-io★ 36,394

DayuanJiang · TypeScript+92 stars this week (+0.3%)

Draw and edit draw.io diagrams by chatting with an AI. Web app, desktop app, and an MCP server for Claude Code, Cursor, Codex and VS Code.

agentscopeTrending★ 33,797

agentscope-ai · Python+378 stars this week (+1.1%)

Build and run agents you can see, understand and trust.

All 2017 Media & Design MCP servers →

Data last updated 25 October 2026. Stars and downloads are refreshed every day from GitHub and npm.