Shadcn MCP for Trae

One MCP URL gives Trae's AI chat live tools to search, preview, and install every block, component, and icon on shadcn.io — no hallucinated props, no broken installs.

Install

In Trae, open the AI chat panel, click the MCP servers icon, select Add manually, and paste the configuration below:

Paste it in once signed in with an active Pro subscription — the config carries your personal token, so treat the full URL like an API key. Pro starts at $19/mo and includes MCP access across every editor plus 6,000+ production-ready blocks. Not Pro yet? See what you unlock →

Trae's MCP schema is Cursor-compatible — mcpServers + url + optional headers — so any config you already have from another client generally works with minor renaming. Changes take effect as soon as you save the manual config.

Using a header instead

If you'd rather keep the token out of the URL, Trae accepts a headers object:

{
"mcpServers": {
  "shadcnio": {
    "url": "https://www.shadcn.io/api/mcp",
    "headers": {
      "Authorization": "Bearer YOUR_TOKEN"
    }
  }
}
}

A Team or Organization plan gives every workspace member their own Pro entitlement.

Install your first block

use shadcnio to install hero-announcement into my project

What Trae actually does, in order:

1. search_items({ query: "hero-announcement" }) to confirm the slug resolves.
2. get_item({ name: "hero-announcement" }) for a cheap metadata peek.
3. get_install_command({ name: "hero-announcement" }) — returns a shadcn add https://www.shadcn.io/r/hero-announcement.json?token=… URL with your token already in the query string.
4. Runs it through the integrated terminal. Files land under components/ui/.

Name the server explicitly ("use shadcnio…") when multiple MCPs are configured.

The example above uses hero-announcement, a Pro block — the install runs once you're signed in with an active subscription.

Manage the connection

Reopen the MCP servers panel in the AI chat to see every configured server and its live status. Each entry has an edit button and a toggle to disable without removing.

If your Pro subscription lapses, the next tool call returns 403 and Trae surfaces a red status on the shadcnio entry. Resubscribing restores access on the following request — no reconfigure, no reinstall. The token itself stays valid across subscription gaps.

FAQ