aquila-lab

Wonder Plugins — Development skill for Claude Code

Development community

Wonder agent plugins for Cursor, Claude Code, and Codex.

How to install Wonder Plugins

This entry records only its repository, not the path inside it, so there is no exact command to give. Open aquila-lab/wonder-plugins and copy the folder into ~/.claude/skills/, or the file into ~/.claude/agents/.

What Wonder Plugins does

Wonder agent plugins for Cursor, Claude Code, and Codex. Connects your IDE to the Wonder MCP server at mcp.wonder.so.

Alternatives in Development

  • Mempalace Init — Set up MemPalace — install the package, initialize a palace, register the MCP server with Cursor, and verify e 58.6k ★
  • Browser Tools MCP — Monitor browser logs directly from Cursor and other MCP compatible IDEs 7.2k ★
  • Code — Open MARVIN in your IDE (Cursor, VS Code, etc 1k ★

README

Wonder plugins

Create and edit designs with your coding agent on a canvas where every design is real code. Wonder plugins are available for Cursor, Claude Code, and Codex.

Install

Cursor

  1. Open **Customize** in the Cursor sidebar.

  2. Search for **Wonder**, select **Install**, and choose a user or project scope.

  3. Open the [Wonder](https://wonder.design) app and open any canvas file you want the generations drawn to. Then, back in Cursor, type a prompt like:

    Generate a purple button in Wonder
  4. On first use, Cursor will say the Wonder MCP needs authentication and show a URL. Open it in your browser to authorize, then come back to Cursor and re-send the same prompt. Watch it draw onto your canvas in real time.

Claude Code

  1. Open your terminal and run `claude` to start Claude Code.

  2. Add the marketplace:

    /plugin marketplace add aquila-lab/wonder-plugins
  3. Install the plugin:

    /plugin install wonder@wonder
  4. Reload to activate it:

    /reload-plugins
  5. Open the [Wonder](https://wonder.design) app and open any canvas file you want the generations drawn to. Then, back in Claude Code, type a prompt like:

    Generate a purple button in Wonder
  6. On first use, Claude will say the Wonder MCP needs authentication and print a URL. Open that link in your browser to authorize, then come back to Claude Code and re-send the same prompt. Watch it draw onto your canvas in real time.

![Wonder running in Claude Code](./assets/claude-code-walkthrough.png)

Codex

  1. With the Codex CLI installed, add the Wonder marketplace from your terminal:

    codex plugin marketplace add aquila-lab/wonder-plugins
  2. Install the plugin:

    codex plugin add wonder@wonder
  3. Restart Codex and start a new chat. Type `@wonder` and select the installed Wonder plugin. The **Wonder · Computer use** entry starts desktop automation.

  4. Open a canvas i