@aidesigner/agent-skills

Multi-host bootstrap and local helper CLI for using AIDesigner through supported MCP clients.

What it does

• Installs repo-local or user-wide MCP config for Claude Code, Codex, Cursor, VS Code/Copilot, and Windsurf
• Writes shared or host-native AIDesigner skill files so supported clients know how to use the MCP tools
• Keeps Claude-specific agents and slash commands for the Claude workflow
• Checks MCP discovery and host-specific setup with doctor
• Captures MCP-generated HTML into local .aidesigner/ runs
• Renders previews and creates adoption briefs for porting designs into a real codebase

Install

Use npx:

npx -y @aidesigner/agent-skills init

Or install globally:

npm install -g @aidesigner/agent-skills
aidesigner init

Requirements

• Node.js 20+
• Access to the AIDesigner MCP server
• An MCP-capable client such as Claude Code, Codex, Cursor, VS Code/Copilot, or Windsurf

Common commands

Initialize Claude Code in the current repo:

aidesigner init

Initialize a specific host in the current repo:

aidesigner init cursor

Initialize Codex for just the current repo:

aidesigner init codex

Initialize Codex for the current repo and mark that repo as trusted in Codex:

aidesigner init codex --trust-project

Initialize one host once for all repos:

aidesigner init codex --scope user

Initialize every supported host for the chosen scope:

aidesigner init --all

Refresh generated MCP config and skill files after upgrading the package:

aidesigner upgrade
aidesigner upgrade cursor
aidesigner upgrade codex --trust-project

Check the default Claude setup:

aidesigner doctor

Check one host or every host:

aidesigner doctor cursor
aidesigner doctor --all

Preview a saved run:

aidesigner preview --id <run-id>

Generate an adoption brief:

aidesigner adopt --id <run-id>

Supported hosts

• claude: project or user scope
• codex: project or user scope
• cursor: project or user scope
• vscode: project or user scope
• windsurf: user scope only

Client setup

Claude Code

Project setup:

aidesigner init

User setup:

aidesigner init claude --scope user

What gets written:

• .mcp.json
• .claude/agents/aidesigner-frontend.md
• .claude/commands/aidesigner.md
• .claude/skills/aidesigner-frontend/SKILL.md

Connect:

1. Open Claude Code in the repo.
2. Run /mcp.
3. Connect aidesigner and finish browser sign-in.
4. Ask Claude to use AIDesigner or run /aidesigner <prompt>.

Codex

Project setup:

aidesigner init codex --trust-project

User setup:

aidesigner init codex --scope user

What gets written:

• Project: .codex/config.toml and .agents/skills/aidesigner-frontend/SKILL.md
• User: ~/.codex/config.toml and ~/.agents/skills/aidesigner-frontend/SKILL.md

Connect:

1. Open a fresh Codex session in the repo.
2. If needed, run codex mcp login aidesigner.
3. Finish browser sign-in.
4. Prompt Codex to use the aidesigner MCP server.

Codex note:

1. Project .codex/config.toml only loads for trusted repos.
2. --trust-project also writes projects.<path>.trust_level = "trusted" to ~/.codex/config.toml.

Cursor

Project setup:

aidesigner init cursor

User setup:

aidesigner init cursor --scope user

What gets written:

• Project: .cursor/mcp.json, .cursor/skills/aidesigner-frontend/SKILL.md, and .agents/skills/aidesigner-frontend/SKILL.md
• User: ~/.cursor/mcp.json and ~/.cursor/skills/aidesigner-frontend/SKILL.md

Connect:

1. Restart Cursor or reload the workspace.
2. Open Cursor's MCP settings panel.
3. Connect aidesigner and finish browser sign-in.

VS Code / GitHub Copilot

Project setup:

aidesigner init vscode

User setup:

aidesigner init vscode --scope user

What gets written:

• Project: .vscode/mcp.json, .github/skills/aidesigner-frontend/SKILL.md, and .agents/skills/aidesigner-frontend/SKILL.md
• User: the VS Code user MCP file and ~/.copilot/skills/aidesigner-frontend/SKILL.md

Connect:

1. Open VS Code in the repo.
2. Open Copilot Chat and switch to Agent mode.
3. Enable aidesigner in the tools picker or MCP server list.
4. Finish browser sign-in if prompted.

Windsurf

User setup:

aidesigner init windsurf --scope user

What gets written:

• ~/.codeium/windsurf/mcp_config.json

Connect:

1. Restart Windsurf.
2. Open Cascade and inspect the MCP servers panel.
3. Connect aidesigner and finish browser sign-in.

Upgrading

Existing installs keep working after upgrading the package. If your MCP config and auth are already healthy, you do not need to rerun setup immediately.

Run upgrade only if you want refreshed generated config and skill files for your host:

aidesigner upgrade
aidesigner upgrade cursor
aidesigner upgrade vscode
aidesigner upgrade codex
aidesigner upgrade codex --scope user

Then verify with:

aidesigner doctor <host>

init still works for this, but upgrade is the clearer command when the host is already set up.

Advanced helper commands

Persist MCP-generated HTML locally:

aidesigner capture --html-file .aidesigner/mcp-latest.html --prompt "<prompt>" --transport mcp --remote-run-id "<run-id>"

Fallback direct generation with API key auth:

AIDESIGNER_API_KEY=... aidesigner generate --prompt "<prompt>"

Refine a prior run:

aidesigner refine --id <run-id> --prompt "<feedback>"

Environment variables

• AIDESIGNER_API_KEY: optional non-MCP fallback auth
• AIDESIGNER_BASE_URL: overrides the default https://api.aidesigner.ai
• AIDESIGNER_MCP_URL: overrides the MCP endpoint
• AIDESIGNER_CLAUDE_BIN: overrides the Claude CLI path
• AIDESIGNER_CLAUDE_HOME: overrides the Claude config directory
• AIDESIGNER_CODEX_BIN: overrides the Codex CLI path
• AIDESIGNER_CODEX_HOME: overrides the Codex config directory
• AIDESIGNER_AGENTS_HOME: overrides the shared ~/.agents skill directory
• AIDESIGNER_CURSOR_HOME: overrides the Cursor config directory
• AIDESIGNER_VSCODE_BIN: overrides the VS Code CLI path
• AIDESIGNER_VSCODE_HOME: overrides the VS Code user data directory
• AIDESIGNER_COPILOT_HOME: overrides the Copilot skill directory
• AIDESIGNER_WINDSURF_HOME: overrides the Windsurf config directory
• AIDESIGNER_HOST_COMMAND_CWD: overrides the neutral cwd used for host CLI registration and checks

Package development

From this package directory:

npm test
npm run check
npm run pack:dry-run