Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 11 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ Magic Component Platform (MCP) is a powerful AI-driven tool that helps developer
- [Windsurf](https://windsurf.ai) support
- [VSCode](https://code.visualstudio.com/) support
- [VSCode + Cline](https://cline.bot) integration (Beta)
- [AdaL CLI](https://sylph.ai/) support
- **Modern Component Library**: Access to a vast collection of pre-built, customizable components inspired by [21st.dev](https://21st.dev)
- **Real-time Preview**: Instantly see your components as you create them
- **TypeScript Support**: Full TypeScript support for type-safe development
Expand Down Expand Up @@ -45,6 +46,7 @@ Magic Component Platform (MCP) is a powerful AI-driven tool that helps developer
- Cursor
- Windsurf
- VSCode (with Cline extension)
- [AdaL CLI](https://sylph.ai/)

### Installation

Expand All @@ -63,7 +65,7 @@ One command to install and configure MCP for your IDE:
npx @21st-dev/cli@latest install <client> --api-key <key>
```

Supported clients: cursor, windsurf, cline, claude
Supported clients: cursor, windsurf, cline, claude, adal
Copy link

Copilot AI Feb 25, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The claim that "adal" is a supported client for the CLI installation command needs verification. The README references npx @21st-dev/cli@latest install <client> --api-key <key> which appears to be a separate CLI tool not present in this repository. Without evidence that the @21st-dev/cli tool actually supports "adal" as a client option, this could mislead users attempting to use the CLI installation method with AdaL CLI.

Suggested change
Supported clients: cursor, windsurf, cline, claude, adal
Supported clients: cursor, windsurf, cline, claude

Copilot uses AI. Check for mistakes.

#### Method 2: Manual Configuration

Expand Down Expand Up @@ -147,6 +149,14 @@ Optionally, you can add it to a file called `.vscode/mcp.json` in your workspace
}
```

#### Method 4: AdaL CLI

If you're using [AdaL CLI](https://sylph.ai/), add the Magic MCP server with a single command:

```bash
/mcp add magic --command npx --args "-y,@21st-dev/magic@latest,API_KEY=your-api-key"
Copy link

Copilot AI Feb 25, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The API key placeholder format is inconsistent between the two files. In README.md (line 155), it uses "your-api-key", while in llms-install.md (line 72), it uses "<API_KEY>". For consistency with the rest of llms-install.md which uses "<API_KEY>" in lines 34, 58, and 75, both files should use the same placeholder format throughout. Choose either the descriptive form "your-api-key" or the template form "<API_KEY>" and apply it consistently across both documentation files.

Suggested change
/mcp add magic --command npx --args "-y,@21st-dev/magic@latest,API_KEY=your-api-key"
/mcp add magic --command npx --args "-y,@21st-dev/magic@latest,API_KEY=<API_KEY>"

Copilot uses AI. Check for mistakes.
```

## ❓ FAQ

### How does Magic AI Agent handle my codebase?
Expand Down
10 changes: 10 additions & 0 deletions llms-install.md
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,16 @@ The Magic MCP server requires configuration based on the client type. Below are

2. Replace `<API_KEY>` with the actual TWENTY_FIRST_API_KEY value.

#### For AdaL CLI

If you're using [AdaL CLI](https://sylph.ai/), add the Magic MCP server with a single command:

```bash
/mcp add magic --command npx --args "-y,@21st-dev/magic@latest,API_KEY=your-api-key"
```

Replace `<API_KEY>` with the actual TWENTY_FIRST_API_KEY value.

### 2. Verification

To verify the installation:
Expand Down