Skip to content

MCP & CLI

Hand your agent the library

Everything a human can see here, an agent can read too: search, previews, metadata and, with Pro, the source. Pick whichever interface your tool speaks. All of them are read-only.

~/acme-web — claudemcp: assembli

> Add a pricing section from Assembli to the landing page

assembli · search_components(q: "pricing", limit: 3)

pricing-access-card Access Pass Pricing Cardpricing-one-plan One Plan Pricingpricing-plan-switcher Plan Switcher Pricing

assembli · get_component(slug: "pricing-cards")

1 file · 110 lines · npm: lucide-react · ui: badge, button

Bash(npx shadcn@latest add @assembli/pricing-cards)

✔ Created components/pricing-cards/pricing-cards.tsx

Added <PricingCards /> below the features section in app/page.tsx.

>

Set up your agent

Add the server, then sign in once in your browser. No API keys to copy and no config to edit.

MCPhttps://assembli-rho.vercel.app/mcp

Add the plugin, then sign in once from /mcp.

  1. 1

    Add the marketplace

    Run this inside Claude Code.

    /plugin marketplace add assembli-ui/claude-plugin
  2. 2

    Install the plugin

    Then this, on its own. The plugin adds the MCP server and a skill that tells Claude when to reach for the library.

    /plugin install assembli@assembli

    Or add just the MCP server, from your terminal:

    claude mcp add --transport http assembli https://assembli-rho.vercel.app/mcp
  3. 3

    Sign in

    Run /mcp, pick assembli and choose Authenticate. Your browser opens: sign in and click Allow. Search works on any account; source needs Pro, and unlocks the moment you subscribe.

Scripts and CI can't open a browser: create a key on your account page and set ASSEMBLI_API_KEY, or use device login.

What do you want to do?

Once it's set up, just ask. With the Claude Code plugin, Claude reaches for the library on its own; for any other agent, copy the prompt.

Find and install a component

Describe what you need. The agent searches, checks the preview, installs it with its dependencies and wires it in.

Search free · install with Pro

Start from a landing page

Full single-file pages, grouped by industry. Pick one that fits, install it and swap in your own content.

Pro

Load the catalog into context

Give an agent the whole index in one fetch, so it can suggest components while it builds.

Free

Reference

Every interface the setup above uses, for wiring Assembli into your own tools.

Access

Free · no key

  • Search and filtering
  • Metadata and categories
  • Live previews
  • llms.txt index

· $12/month

  • Component source
  • get_component and /r/<slug>.json
  • Markdown source sections

Sign in when you set up your agent, or create a key on your account page and send it as a bearer token.

00Device login

POST /api/agent/login

For agents without an MCP client that can sign in: device login, the same pattern as gh auth login, gets them their own API key. The agent asks for a code and shows you a link. You sign in, approve and subscribe if you haven't yet, and the agent collects the key on its next poll. It never touches your login or payment.

curl -X POST https://assembli-rho.vercel.app/api/agent/login \
  -H "content-type: application/json" -d '{"client_name":"Claude Code"}'

Show the user verification_uri_complete, then poll every 5 seconds until the response has api_key (it returns authorization_pending while waiting):

curl -X POST https://assembli-rho.vercel.app/api/agent/token \
  -H "content-type: application/json" -d '{"device_code":"asmd_…"}'

On the open MCP endpoint, the connect_account and finish_connect tools do the same. Approvals happen at /connect, and every key shows up on your account page, where you can revoke it.

01MCP server

POST /mcp

Streamable HTTP at https://assembli-rho.vercel.app/mcp with search_components, list_categories and get_component (full source and install steps, with Pro). It signs clients in with OAuth: the first connection opens your browser, and the client keeps the token it's issued. Tokens are API keys, so they show up on your account page, where you can revoke them.

claude mcp add --transport http assembli https://assembli-rho.vercel.app/mcp

https://assembli-rho.vercel.app/api/mcp is the same server without sign-in: search is open, get_component returns source for an API key, and it adds the device-login tools connect_account and finish_connect. Use it from scripts and CI:

claude mcp add --transport http assembli https://assembli-rho.vercel.app/api/mcp \
  --header "Authorization: Bearer $ASSEMBLI_API_KEY"

02shadcn registry

GET /r/<slug>.json

Every component is a registry item at /r/<slug>.json. The CLI writes it to components/<slug>/<slug>.tsx and installs npm and shadcn/ui dependencies. Items need an API key, so add the @assembli registry to your project's components.json once:

{
  "registries": {
    "@assembli": {
      "url": "https://assembli-rho.vercel.app/r/{name}.json",
      "headers": {
        "Authorization": "Bearer ${ASSEMBLI_API_KEY}"
      }
    }
  }
}

Put your key in .env.local as ASSEMBLI_API_KEY=asm_…, then:

npx shadcn@latest add @assembli/<slug>

Index of all items: /r/registry.json

03Markdown

Accept: text/markdown

Append .md to any page, or send Accept: text/markdown. Component pages include install steps, and with an API key the full source and a usage example.

curl -H "Authorization: Bearer $ASSEMBLI_API_KEY" https://assembli-rho.vercel.app/components/<slug>.md

04JSON API

GET /api/components
  • GET/api/components?q=&category=&subcategory=&tag=&limit=Search and filter with the same ranking as ⌘K. subcategory narrows a category to one type, e.g. saas landing pages. An unfiltered q also returns the matching categories.
  • GET/api/components/<slug>Metadata and install commands. With an API key, source files and a ready-to-paste agent prompt.
  • GET/api/components/<slug>?format=packageOne JSON document for pnpm registry:import (API key).
  • GET/api/categoriesCategories with counts.
curl "https://assembli-rho.vercel.app/api/components?q=pricing&limit=5"

05llms.txt

GET /llms.txt

/llms.txt indexes every component with links to its Markdown. Source is served one component at a time.

06Adding components (in this repo)

Components live in registry/components/<slug>/ as meta.json, <slug>.tsx and demo.tsx. The repo's AGENTS.md has the conventions. The CLI is non-interactive and supports --json:

pnpm registry:new my-card --title "My Card" --category cards
pnpm registry:import ./generated.json
pnpm registry:validate --json

Search components

Search by name, tag, category or type