PyModel/designer-skill

npm i designer-skill-mcp
Register via mcp.json: mcpServers designer-skill with command npx and args ["-y", "designer-skill-mcp@latest"]
Plugin install: /plugin marketplace add Pythoughts-labs/designer-skill && /plugin install designer-skill@pythoughts-labs

Usage

• •One-line add in any MCP client — no API key; config examples ship for Pythinker, Codex CLI, Claude Code/Desktop, Cursor, VS Code, Kilo Code, Open Code, and Pi.
• •Run get_design_system, dispatch_intent, then get_reference before writing UI code.
• •Call anti_slop_checklist as the ship gate before declaring UI work done.
• •HTTP mode: node dist/index.js --http --port 3017 serves Streamable HTTP at /mcp for remote clients.

Key features

• ✓10 MCP tools: get_design_system, load_project_context, get_reference, list/get_command, dispatch_intent, detect_antipatterns (44 deterministic rules, no LLM, no API key), get_palette_seed (OKLCH), anti_slop_checklist.
• ✓15 reference files in core (8) and extended (7) tiers covering design principles, differentiation, aesthetic systems, motion, engineering/performance, avoid-ai-slop, and CSS techniques.
• ✓Intent-to-verb mapping table and a 6-step preflight for surface scoping.
• ✓Plugin bundle (mcp.json + skills + /designer-setup, /designer-status commands) for Claude Code, Codex, and Cursor.
• ✓Demonstrated on a live production site (pythinker.com).

Best for

Developers and coding agents who want less generic, AI-slop UI and a consistent design methodology enforced before shipping front-end work.

Caveats

• ⚠HTTP mode has no built-in auth for public exposure — add your own auth/proxy if binding beyond 127.0.0.1.
• ⚠VS Code MCP config requires VS Code 1.99+ or the MCP extension.
• ⚠Use @latest for newest npm release; pin @0.11.0 for teams; skill content updates separately via /plugin update.
• ⚠Skill content and MCP server are separate artifacts packaged together.