How do I install 21st.dev?

Copy the http config for Cursor, Claude Desktop, Claude Code, or VS Code on this page. It uses the publisher's install, not a PlugMCP proxy.

Does 21st.dev need an API key?

No required environment variable is listed on this record.

21st.dev

by dev.21st

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

Power your agent

Add this server

The publisher's own URL. Not a PlugMCP endpoint.

Server URL

https://21st.dev/api/mcp

Provider

Add in Claude

Claude opens with the name and URL filled in. You still confirm it there.

Claude Code

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

Run in a terminal.

Claude Desktop

{
  "mcpServers": {
    "dev.21st-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-remote",
        "https://21st.dev/api/mcp"
      ]
    }
  }
}

claude_desktop_config.json

Step-by-step: add this in Claude

Remote URL or a command on your machine? How the two installs differ

Run on PlugMCP

Host a copy with our keys and logs.

A new server you create. It is not this listing's official endpoint. Use the publisher install when you want their URL and their credentials.

Launch

Related MCP

Related skills

View all

Questions

How do I install 21st.dev?: Copy the http config for Cursor, Claude Desktop, Claude Code, or VS Code on this page. It uses the publisher's install, not a PlugMCP proxy.
Does 21st.dev need an API key?: No required environment variable is listed on this record.
What transport does 21st.dev use?: 21st.dev is reached over HTTP.
When was 21st.dev last checked?: Last checked 2026-10-16. Find UI components and themes, retrieve code, and generate with hosted 21st AI when enabled.

README is not crawled yet. No repository on file.