21st.dev MCP Server: Install & Setup

Install 21st.dev in Claude Code

Claude Code

claude mcp add --transport http 21st-dev https://21st.dev/api/mcp

mcp.json (Claude Desktop, Cursor, VS Code, Windsurf)

{
  "mcpServers": {
    "21st-dev": {
      "url": "https://21st.dev/api/mcp"
    }
  }
}

Frequently asked questions

What does the 21st.dev MCP server do?

Find UI components and themes, retrieve code, and generate with hosted 21st AI when enabled.

Is the 21st.dev MCP server free?

The server is free, but you will likely need an account. The server itself is free, but it connects to a service that needs an account or API key, which may have paid tiers. Check the provider for current pricing.

Does 21st.dev run locally or remotely?

Remote. Hosted by the provider. You connect with a URL, nothing to install.

How do I add 21st.dev to Claude Code?

Run: claude mcp add --transport http 21st-dev https://21st.dev/api/mcp

More developer tools MCP servers

View all

3TG Test Generation

dev.3tg/mcp

3rd Generation Testing (3TG) — generate deterministic test suites from Markdown spec tables via MCP.

RemoteAccount needed

ハルCMS (HARU CMS)

Masato-haru/webharu-cms

日本語ヘッドレスCMS。記事の作成・更新・予約公開・画像取り込みをAIから実行できる。APIキーで接続、npm不要。Astro/Next.js等へ配信APIで届く。

Local + RemoteAccount needed

4fetch

io.github.amit755/4fetch

Fetch a URL and get clean Markdown with metadata. No API key required; rate-limited per IP.

RemoteFree

Zumen

meta-taro/zumen

AI-editable diagrams as code: draw from YAML, propose diffs a human applies, export SVG/Mermaid.

LocalFree

ABMeter

abmeter/abmeter

Run A/B experiments through your AI assistant. SDKs for Ruby, Python, JS, Node, React Native, Go.

RemoteAccount needed

Zod Contract Mock Forge

vola-trebla/zod-contract-mock-forge-mcp

MCP server for deterministic mock generation and API contract scaffolding using Zod schemas

LocalFree