21st.dev Review (2026): 12,000 shadcn Components, an MCP Server, and No Monthly Plan
Disclosure: this post contains affiliate links to 21st.dev. If you subscribe through them we may earn a commission at no extra cost to you. Every price below was.
21st.dev calls itself “the living library of interfaces”: 12,000+ React components, templates and shadcn themes published by around 700 design engineers, plus an MCP server so your coding agent can search and install them without you leaving the editor.
It is genuinely cheap compared with the AI app builders. It also has a billing structure that almost every write-up gets wrong, and a product rename that quietly broke people’s setups. Both are below.
@21st-dev/magic package survives only as “a thin compatibility proxy so old configs keep working”, and the project states plainly that old API keys were reset. Any tutorial telling you to install Magic MCP is out of date.21st.dev pricing: there is no monthly plan
This is the thing to understand before anything else. 21st.dev’s pricing page offers two billing toggles: Quarterly and Yearly. There is no month-to-month option. Every “$6” or “$15” you see quoted elsewhere is a per-month rate inside a longer commitment.
| Plan | Billed quarterly | Billed yearly | What you get |
|---|---|---|---|
| Free | $0 | $0 | Unlimited search. 2 component code retrievals or installs per day, shared across web, CLI and MCP. No AI generation. |
| Builder | $8 / month | $6 / month | Unlimited code copies and installs, including via MCP and CLI. 29,000 icons. Shaders, gradients, ASCII art. No AI generation. |
| Builder + AI (500 credits/mo) | $20 / month | $15 / month | Everything in Builder, plus multi-model AI generation and Design Bug Bot. |
| Builder + AI (1,000 credits/mo) | $40 / month | $30 / month | Same, more credits. |
| Builder + AI (2,000 credits/mo) | $80 / month | $60 / month | Same, more credits. |
| Team (2–50 seats) | $10 / seat / month | $7.50 / seat / month | Shared collections, private team components, admin controls, centralised billing. AI credits optional per seat. |
The yearly column is labelled “Save 25%” on the pricing page. Credit top-ups are +100 credits for $5, and pack credits roll over once the monthly allowance is spent; auto top-up exists but is off by default with a cap you set. The page states: “Cancel anytime. Payments are non-refundable.”
The free tier is more useful than it sounds
Two code retrievals a day is restrictive if you are building, but search is free on every plan — including free. So you can browse all 12,000 components, find the one you want, and pull it. You just cannot pull twenty in an afternoon. For evaluating whether the library has what you need, that is enough.
What you actually get
The pieces
- The marketplace — 12,000+ components, templates and themes; 2,000+ marketing blocks and 2,100+ UI components, plus 29,000 icons across Phosphor, Tabler, Lucide, Heroicons and others. Fifty-plus libraries are indexed, including shadcn/ui itself, Aceternity UI, Magic UI and Origin UI.
- 21st AI — text-to-UI generation that produces several parallel “takes”. Sketch mode makes fast HTML/Tailwind drafts; Code mode produces full React/shadcn components with a live preview.
- 21st MCP — an HTTP MCP server at
https://21st.dev/api/mcp, authenticated with anx-api-keyheader. Supports Cursor, Claude (including Claude Code), VS Code, Windsurf, Codex and Devin Desktop, “or any MCP client”. - 21st CLI —
npm i -g @21st-dev/cli, withsearch,generate,publishandusagecommands. - Design Bug Bot — shipped 7 September 2026. Reviews GitHub pull requests for inconsistent components, typography and mobile layout problems, and proposes fix code. Five free reviews, then it draws on AI credits.
Installing the MCP is one command: npx @21st-dev/cli@latest init --client cursor. The free tools are search, get_component and get_theme; generate and iterate_generation cost credits.
What it does not tell you
Undisclosed, and worth knowing
- Which AI models it uses. 21st deliberately does not say. Its launch post presents results as “Take 1, Take 2, Take 3” and says it uses “every frontier model” without naming any, explicitly to prevent brand bias. Honest about being opaque, but opaque.
- What a generation costs in credits. The docs say only that
iterate_generation“varies by model”. With 500 credits a month and no published per-action rate, you cannot forecast whether that is ten generations or a hundred. - Whether component authors earn anything. Template sales pay creators 70% after the card fee — the docs work through a $39 sale paying $26.30 — with a $50 minimum payout, a 30-day hold and payment by email provider or USDC on Base or Polygon. For components, the docs say authors “earn from their usage” but publish no mechanism or rate.
- Regional pricing. Not mentioned anywhere. All prices are USD.
One number to treat carefully: the homepage says 12,000+ components while the MCP repo’s README still says 10,000+. The 12,000 figure also clearly bundles templates, themes, icons and variants, since the itemised counts — 2,000+ marketing blocks and 2,100+ UI components — do not come close to summing to it. Do not read 12,000 as a component-only count.
How it compares
| Tool | Free tier | Paid entry | What it is |
|---|---|---|---|
| 21st.dev | 2 code retrievals/day, free search | $6/mo yearly (no AI) · $15/mo yearly with AI | Component library + MCP + generation |
| shadcn/ui | Entirely free, MIT | — | The component conventions 21st is built around |
| v0 by Vercel | 7 messages/day | $30/user/mo | Full app and page generation |
| Lovable | 5 build credits/day, capped at 30/mo | $25/mo (100 credits) | Full-stack app builder |
| Bolt | 300K tokens/day | $25/mo | Full-stack app builder |
| Subframe | 1 project, limited AI credits | $20/editor/mo | Visual design-to-code editor |
The honest comparison is not against v0 or Lovable — those build whole applications and charge accordingly. 21st.dev solves a narrower problem, which is why it is a quarter of the price. Its real competitor is shadcn/ui itself, which is free forever. What you are paying for is breadth, the agent-native delivery, and now PR design review.
Two things a fair review has to mention
There is no mainstream press coverage of 21st.dev. We looked. Everything that ranks is affiliate or SEO content. That is not damning for a three-person YC Winter 2026 company out of San Francisco, but it means there is no independent assessment of it anywhere — including, to be clear, this post, which is a documentation review rather than a long-term test.
They had a security incident, and they published a postmortem. On 26 February 2026 a database defacement — over-permissive Supabase row-level security plus an exposed pg_graphql endpoint — let an attacker overwrite component and demo records with slurs and pornographic URLs, which were briefly served to users in place of component code. 21st states no API keys, secrets or user credentials were leaked, and fixed it with a point-in-time restore, disabling pg_graphql and tightening the RLS policies. Publishing that writeup rather than burying it is to their credit, and it is the kind of thing you want to know before you let a registry inject code into your project.
Who it is for
Good fit
- You already build in React, Tailwind and shadcn/ui and spend time hunting for a decent hero or pricing table.
- You work in Cursor, Claude Code, VS Code or Windsurf and want components retrievable by your agent rather than by browser tab.
- You review a lot of front-end PRs and would use an automated design-regression check.
- You can live with a quarterly commitment — $24 for three months of Builder is a low bar.
Poor fit
- You want month-to-month billing. It is not offered.
- You need predictable AI costs. Credits exist; per-action rates do not.
- You want a full app generator — that is v0, Lovable or Bolt, at three to five times the price.
- shadcn/ui alone already covers you. It is free, and 21st is built on its conventions rather than replacing them.
If it fits, the free tier costs nothing to try and search is unlimited on it: browse 21st.dev, or go straight to the pricing page and the MCP setup.
Frequently asked questions
How much does 21st.dev cost?
Builder is $8 per month billed quarterly or $6 per month billed yearly. Builder + AI starts at $20 quarterly or $15 yearly for 500 credits a month, rising to $80 or $60 for 2,000 credits. Team seats are $10 or $7.50 per seat per month. There is no month-to-month billing option.
Is 21st.dev free?
There is a free tier with unlimited component search and 2 code retrievals or installs per day, shared across the website, CLI and MCP server. AI generation is not included on the free tier.
What happened to Magic MCP?
Magic MCP was renamed 21st MCP and Magic Chat became 21st AI in July 2026. The @21st-dev/magic package remains as a compatibility proxy so older configurations keep working, but old API keys were reset and must be regenerated.
What is the 21st.dev MCP server URL?
https://21st.dev/api/mcp, authenticated with an x-api-key header. It works with Cursor, Claude Code, VS Code, Windsurf, Codex and Devin Desktop, or any MCP client.
Do 21st.dev component authors get paid?
Template sellers receive 70% of the sale after card fees — the documentation works through a $39 sale paying out $26.30 — with a $50 minimum payout and a 30-day hold. For individual components the documentation says authors earn from usage but publishes no rate or mechanism.
Is 21st.dev better than shadcn/ui?
They are not alternatives. shadcn/ui is a free, MIT-licensed set of component conventions; 21st.dev is a paid marketplace built around those conventions, adding 12,000+ community components, AI generation and an MCP server. If shadcn/ui alone covers your needs, you do not need 21st.dev.
What we could not verify
Open questions
- Credit cost per generation or per Design Bug Bot review — no rate card is published.
- Which AI models 21st AI uses. Deliberately undisclosed.
- Whether regional or purchasing-power pricing exists. Not mentioned either way.
- Any revenue mechanism for component authors, as opposed to template sellers.
- The composition of the 12,000+ figure, which conflicts with the 10,000+ still stated in the MCP repo.
- Funding raised. The company’s Y Combinator profile publishes no figure and we found no credible reporting of one.
If you have run a month of AI credits through it, tell us how far 500 went. That is the number this page is missing.
Related on DailyAIPedia
- Typeform’s MCP server: build forms from Claude or ChatGPT
- Replit Agent benchmarks: 72% on DeepSWE at $2.11 a task
- ChatLLM by Abacus.AI review: 100+ models for $10 a month
- Replit, Softr and Bubble: what shipped in September 2026
- Replit’s October 2026 update: GPT-6.1 Sol, Claude Sonnet 5.5 and the Jev decision model