Judith Rodriguez
@judithrodriguez
Finally a Figma kit that matches the real shadcn/ui experience. Saved me hours on every new feature.
Give your AI agent every component, all 192 blocks, and 294k icons for React, Vue, Svelte, and Solid. With live docs and ready-to-install code, it has what it needs to build the UI you asked for.
Example: you type “Use shadcnpro to set up this project and add a pricing section.”, the agent calls the shadcnpro MCP server, edits the project files, and the browser shows the result.
Claude Code, Cursor, VS Code and 17 more. Give your agent direct access to components, blocks, and the docs to use them. Describe what you need — it finds the right code and installs it in your project.
See all 20 agentsFour simple steps to bring shadcn/ui into your AI workflow. The same URL in Claude Code, Cursor, VS Code and every MCP client.
Set up guidesGive your agent the tools to find components, inspect code, plan pages, and work with themes, Figma, and icons.
Learn more about toolsSpend less time building UI from scratch. Adjust the numbers to estimate what that time is worth and how quickly Pro could pay for itself.
Estimated annual savings
$89,856/ year
Estimates use your inputs and the selected plan price. Include time for customization and integration when estimating hours saved.
16 live tools over the Pro registry: every block in 25 categories, 24 themes, the Figma kit and icon search. The agent finds the block that does what you asked, reads its install command, usage and source, plans a whole page as a stack of blocks, applies a theme and finds icons, all from the live catalog. Install commands run as-is: no invented ids, no broken imports.
Pasted code goes stale and burns context. The MCP is live and the agent asks for exactly what it needs: a ranked search is about a thousand tokens, one block with its install command a few hundred, against tens of thousands for pasted source. You stop re-teaching your agent what exists every conversation.
The official shadcn MCP (npx shadcn@latest mcp) browses registries listed in components.json and installs items. The Pro server adds what a registry listing cannot express: ranked search over what blocks do, page planning, usage snippets, complete themes, Figma kit links, icon search and account tools, with no local setup. Use both: the official server for base components, this one for Pro blocks and pages.
Cursor, Claude Code, VS Code, OpenAI Codex, Windsurf, ChatGPT, Claude Desktop, Gemini CLI, Zed, JetBrains, Cline, Roo Code, Continue, OpenCode, Amp, Warp, Trae, Kiro, GitHub Copilot CLI and Antigravity each have a setup guide, and any client that speaks MCP over HTTP works. Stdio-only clients connect through the mcp-remote bridge.
Subscribe to any Pro plan, open Account › MCP server, create a key and copy the config for your client with the key already filled in. The endpoint is https://pro.shadcn.co/api/mcp and the key travels as an Authorization: Bearer header. It takes about a minute per client.
The server takes both: Authorization: Bearer <key> on the plain endpoint, or ?token=<key> in the URL. Use the header wherever your client can set one; ChatGPT, Claude Desktop connectors and Warp cannot, so they use the URL. A URL can end up in logs, so treat it like a password.
Name the server once: "use shadcnpro to add a date picker block". After that the agent picks the tools itself; the server also sends it short instructions on when to use what. Some clients cap how many tools they load across servers, so switch off servers you are not using in a project.
Ask the agent to call whoami: it answers with your email, plan and the requests left this minute. From a terminal, the curl command on the setup page does the same without any client in between.
16 tools in groups: discover (list_block_categories, list_blocks, search_blocks), inspect (get_block), plan (plan_page), install (get_install_command, get_project_setup, check_setup), themes (list_themes, get_theme), figma (get_figma_link), icons (list_icon_libraries, search_icons, get_icon), guides (get_guide) and account (whoami). Each has a sample call on the tool reference.
search_blocks ranks blocks by what they do and understands synonyms, so "modal" finds the dialogs and "login" the sign-in screens. get_block then returns the install command, the import line and the files in one call. The agent runs the shadcn CLI command in your project after you approve, and the block arrives with the shadcn/ui components it uses.
plan_page turns a brief into an ordered stack of blocks for a landing, pricing, contact, blog, sign-in, sign-up, dashboard, onboarding or 404 page, or for a custom list of sections. It returns a pick with alternatives per section, one install command for the stack and an app/page.tsx skeleton. The build-page prompt walks the agent through it.
get_theme returns any of the Pro themes as a complete :root and .dark variable set or a shadcn preset code. get_figma_link points at a component in the Pro Figma kit for handoff or for the Figma MCP. search_icons and get_icon search the icon sets shadcn/ui projects use and return the real import for the set your project already has.
Yes. The MCP server is included with every Pro plan, monthly or yearly. Your key is tied to your account; without an active subscription the server answers 403 with a link to the plans.
The server answers 403 once your subscription ends. The key itself stays valid, so when Pro is active again the same config works within a minute, with nothing to reinstall. Blocks already in your projects stay yours under the license.
No. Data flows one way, from the Pro registry to your agent; your project files never leave your machine. The server sees only the tool calls themselves, such as a search query or a block id, which it logs to improve the catalog.
Treat it like an API key: anyone with it can use your Pro access. Keep it out of git, screenshots and logs; commit the environment-variable variant of the config instead. If it leaks, revoke it under License keys and create a new one; the old one stops working everywhere within a minute.
300 requests a minute per key, shared with the CLI registry. A prompt takes a handful of calls, so only an agent stuck in a loop reaches it; past the limit the server answers 429 with a Retry-After header, and whoami shows how many requests are left.
Yes. On Agency (up to 5 seats) and Enterprise (unlimited seats), every member of the workspace has Pro and creates their own key from their own account. Nobody shares a key, and removing a member ends their access at once.
Commit the variant that reads the key from an environment variable (SHADCNPRO_LICENSE_KEY) and let each developer set it locally. Every client page shows its team variant: ${env:...} in Cursor, ${...} in Claude Code’s .mcp.json, a prompted input in VS Code, bearer_token_env_var in Codex.
401: the key is missing or invalid; copy the config again from your account page. 403: the key is valid but the account has no active Pro; fix billing and the same key works again. 429: more than the per-minute limit on one key; stop the loop and wait the Retry-After seconds.
Copy the whole config again, restart the client (most read their config once at start) and check the transport: the server speaks MCP over HTTP, so a local-only client needs the mcp-remote bridge. Behind a proxy, pro.shadcn.co needs HTTPS access. The troubleshooting guide has the full list.
Testimonials
Judith Rodriguez
@judithrodriguez
Finally a Figma kit that matches the real shadcn/ui experience. Saved me hours on every new feature.
Rhonda Rhodes
@rhondarhodes
Blocks alone paid for the entire license. Building complex flows takes a fraction of the time now. @getshadcn
Marian Perez
@marianperez
Best investment for our design system. The Figma variables integration is seamless and powerful.
David Kim
@davidkim
Finally ditched our old component library. This kit + @getshadcn is the perfect combo for modern web apps.
Sophie Martin
@sophiemartin
The dark mode implementation is flawless. Switching themes feels native and everything looks great.
Judith Rodriguez
@judithrodriguez
Finally a Figma kit that matches the real shadcn/ui experience. Saved me hours on every new feature.
Rhonda Rhodes
@rhondarhodes
Blocks alone paid for the entire license. Building complex flows takes a fraction of the time now. @getshadcn
Marian Perez
@marianperez
Best investment for our design system. The Figma variables integration is seamless and powerful.
David Kim
@davidkim
Finally ditched our old component library. This kit + @getshadcn is the perfect combo for modern web apps.
Sophie Martin
@sophiemartin
The dark mode implementation is flawless. Switching themes feels native and everything looks great.
Rodgers Truck
@rodgerstruck
The component quality is ridiculous. Everything feels polished and ready to ship straight into production.
Kathy Pacheco
@kathypacheco
The system is crazy consistent. No more guessing how a component should behave or look across states. @getshadcn
Samuel Chen
@samuelchen
We shipped our MVP 3 weeks faster thanks to the pre-built blocks. Absolutely worth every penny.
Emily Wong
@emilywong
The CLI integration is genius. Copy from Figma, paste to terminal, boom - working component in seconds.
Michael Brown
@michaelbrown
We're using this for 3 different products now. The multi-brand support with themes is a game changer.
Rodgers Truck
@rodgerstruck
The component quality is ridiculous. Everything feels polished and ready to ship straight into production.
Kathy Pacheco
@kathypacheco
The system is crazy consistent. No more guessing how a component should behave or look across states. @getshadcn
Samuel Chen
@samuelchen
We shipped our MVP 3 weeks faster thanks to the pre-built blocks. Absolutely worth every penny.
Emily Wong
@emilywong
The CLI integration is genius. Copy from Figma, paste to terminal, boom - working component in seconds.
Michael Brown
@michaelbrown
We're using this for 3 different products now. The multi-brand support with themes is a game changer.
Corina McCoy
@corinamccoy
Our team moved from MUI to shadcn/ui and this kit made the transition almost effortless. Huge difference.
Eddie Lake
@eddielake
This is the first shadcn/ui resource that actually feels complete. It elevated our whole design workflow.
Lisa Anderson
@lisaanderson
The attention to detail is incredible. Every state, every variant - it's all there and works perfectly.
Alex Thompson
@alexthompson
As a solo founder, this kit lets me punch way above my weight on design. Looks like we have a whole team.
Jessica Garcia
@jessicagarcia
Documentation is clear, components are solid, and support is responsive. Everything you need.
Corina McCoy
@corinamccoy
Our team moved from MUI to shadcn/ui and this kit made the transition almost effortless. Huge difference.
Eddie Lake
@eddielake
This is the first shadcn/ui resource that actually feels complete. It elevated our whole design workflow.
Lisa Anderson
@lisaanderson
The attention to detail is incredible. Every state, every variant - it's all there and works perfectly.
Alex Thompson
@alexthompson
As a solo founder, this kit lets me punch way above my weight on design. Looks like we have a whole team.
Jessica Garcia
@jessicagarcia
Documentation is clear, components are solid, and support is responsive. Everything you need.