King Design AI CLI

AI-friendly CLI and MCP server for King Design component knowledge across Intact, React, Vue 3, and Vue 2.

npm install -g king-design-ai-cli
king-design-ai list
king-design-ai info Button --framework react --format json
king-design-ai demo Button basic --framework vue --format markdown
king-design-ai mcp

During local development, generate the bundled data from a sibling KPC source checkout:

npm run extract -- --king-design-dir ../kpc
npm run build

Commands

king-design-ai list [--framework intact|react|vue|vue-legacy]
king-design-ai info <Component> [--framework react] [--detail] [--format json]
king-design-ai doc <Component> [--framework vue]
king-design-ai demo <Component> [demoName] [--framework react]
king-design-ai design.md
king-design-ai llms [--full]
king-design-ai setup --client cursor|claude|vscode|codex|opencode --mode both --dry-run
king-design-ai mcp

MCP

{
  "mcpServers": {
    "king-design": {
      "command": "npx",
      "args": ["-y", "king-design-ai-cli", "mcp"]
    }
  }
}

OpenCode configuration:

{
  "$schema": "https://opencode.ai/config.json",
  "mcp": {
    "king-design": {
      "type": "local",
      "command": ["npx", "-y", "king-design-ai-cli", "mcp"],
      "enabled": true
    }
  }
}

MCP tools:

• king_design_list
• king_design_info
• king_design_doc
• king_design_demo
• king_design_md
• king_design_llms

MCP prompts:

• king-design-expert
• king-design-page-generator
• king-design-framework-migrator

Frameworks

| Framework | Package | | --- | --- | | intact | @king-design/intact | | react | @king-design/react | | vue | @king-design/vue | | vue-legacy | @king-design/vue-legacy |