wender-mcp

MCP server for Wender. Use it in Cursor or any MCP client to search styles, inspect Wender files, create artboards, prepare local artboard edits, and apply generated HTML back into Wender.

The current artboard-editing workflow is stateless and does not require any new Supabase tables.

Install

1. Get an API key from Wender → Account → API Keys (create one and copy it).

2. Add to Cursor: Settings → MCP → Edit config. Paste:

{
  "mcpServers": {
    "wender": {
      "command": "npx",
      "args": ["-y", "wender-mcp"],
      "env": {
        "MCP_API_KEY": "YOUR_API_KEY_HERE"
      }
    }
  }
}

Replace YOUR_API_KEY_HERE with your key.

3. Restart Cursor.

Tools

• search_styles – Search the style registry (e.g. "dark minimal", "corporate").
• get_style_by_code – Get a style by code (e.g. --style 123 or random) to apply to your project.
• inspect_wender_file – Inspect a Wender file URL or artboard URL and return named artboards. Default responses are compact; pass includeDetails=true for more detail.
• create_wender_artboard – Create a blank artboard in a Wender file using Wender’s normal generated-artboard defaults. Default responses are compact; pass includeHtml=true for the starter HTML.
• prepare_artboard_edit – Get the Wender system prompt, contextual messages, output contract, and MCP-only hints for a target artboard so the model can run locally.
• validate_artboard_html – Preview sanitizer and normalization effects for candidate HTML without persisting it.
• prepare_local_screen_recreation – Read a local screen file and nearby relative imports, then prepare a reconstruction-focused Wender prompt package for high-fidelity screen recreation.
• apply_artboard_edit – Apply the locally generated assistant message and HTML back into Wender using the existing artboard and chat tables. Default responses are compact and include warnings when Wender sanitizes or normalizes the submitted HTML.
• fail_artboard_edit – Acknowledge that a local run failed or was cancelled. This is a stateless no-op on the Wender backend.

Artboard workflow

1. Give the agent a Wender file URL like https://app.wenderapp.com/file/FILE_ID or an artboard URL like https://app.wenderapp.com/file/FILE_ID?artboard=ARTBOARD_ID.
2. The agent calls inspect_wender_file.
3. If no artboard is explicit, the agent should ask which named artboard to use or whether to create a new one.
4. If needed, the agent calls create_wender_artboard.
5. The agent calls prepare_artboard_edit, generates locally with inline Tailwind or DaisyUI classes, optionally validates with validate_artboard_html, then calls apply_artboard_edit.

For local screen recreation, the agent should resolve the local source file in your repo and call prepare_local_screen_recreation so Wender receives the actual source structure instead of just a natural-language description.

MCP-only HTML notes:

• Custom <style> blocks are not supported in the MCP artboard apply flow.
• Put utility classes inline in the HTML.
• prepare_artboard_edit returns context and hints, not ready-to-persist HTML.
• apply_artboard_edit may sanitize or normalize submitted HTML and reports warnings when it does.

Env

• MCP_API_KEY (required) – Your Wender API key. Connects to Wender at app.wenderapp.com.