Model Context Protocol server for Wireweave DSL - AI-powered wireframe generation

This MCP server enables AI assistants like Claude to generate wireframes using the Wireweave DSL. It provides 32 tools for parsing, rendering, validating, and managing wireframes.

You need a Wireweave API key. Get one from the Dashboard.

npm install -g @wireweave/mcp-server

Or use directly with npx:

npx @wireweave/mcp-server

Add to your Claude Desktop config (~/Library/Application Support/Claude/claude_desktop_config.json):

{
  "mcpServers": {
    "wireweave": {
      "command": "npx",
      "args": ["@wireweave/mcp-server"],
      "env": {
        "WIREWEAVE_API_KEY": "your-api-key"
      }
    }
  }
}

Once configured, you can ask Claude:

Generate a wireframe:

"Create a wireframe for a login page with email and password fields"

Validate UX:

"Check the UX best practices for this wireframe code"

Save to cloud:

"Save this wireframe as 'Dashboard v2' in my project"

Export:

"Export this wireframe to Figma format"

┌───��─────────────┐     ┌─────────────────┐     ┌─────────────────┐
│   Claude/LLM    │────▶│   MCP Server    │────▶│   API Server    │
│                 │     │  (this package) │     │                 │
└─────────────────┘     └─────────────────┘     └─────────────────┘
                              │                       │
                         Tool definitions        Execution
                         Request forwarding      Auth & Rate Limit
                                                 Credit management

The MCP server is a thin client that:

• Defines and exposes 32 tools to AI assistants
• Forwards tool calls to the Wireweave API Server
• Returns results back to the AI

All authentication, rate limiting, and business logic runs on the API Server.

• Documentation
• Dashboard
• Playground
• GitHub

MIT