Skip to directory

About 21st MCP

21st MCP lets coding agents search a component library, retrieve component code, and generate UI variants.

What you can use it for

  • Search components and retrieve/install component code.
  • Generate UI variants using Builder + AI credits.
Connection and setup
Hosting
hosted
Transport
Streamable HTTP
Endpoint
https://21st.dev/api/mcp
Authentication
API key via x-api-key or Bearer; Claude Desktop and Lovable support OAuth.

Requirements

  • 21st account for authenticated component retrieval or generation
  • MCP client supporting Streamable HTTP

Setup steps

  1. Connect to https://21st.dev/api/mcp and authenticate using the supported client flow.
Tools 3+

Three exact tool names appear in current official docs/examples; the docs describe broader MCP workflows and do not claim these are the entire tools/list.

  • search

    Search the 21st component library.

    01
  • get_component

    Retrieve component code from the 21st library.

    02
  • generate

    Generate UI component variants from a prompt.

    03

This server’s available tools can vary by account, permissions, or configuration. The list shown is not its full runtime catalog.

Limitations and notes
  • Free accounts can retrieve/install two components per day; generation uses Builder + AI credits.
Original sources
  • discovery directory

    Toolfolio listing used to discover this product; its MCP label is discovery evidence only.

  • official branding page

    Official product-site icon asset selected and inspected visually; source asset: https://21st.dev/apple-touch-icon.png.

  • official documentation

    Official 21st MCP docs specify endpoint, API-key/OAuth connection, search, component retrieval, and AI generation; examples/documentation identify search, get_component, and generate.

Documentation checked 2026-10-28T17:30:00.000Z. Connection has not been runtime tested.