# Shadcn UI Blocks

> A catalog of 3918 production ready blocks for shadcn/ui across 10 collections, built as plain React and Tailwind on top of shadcn/ui primitives, plus 2 full site templates, 99 Open Graph image templates, a page Designer inside the app and a hosted MCP server. The whole catalog is exposed as a shadcn-compatible registry, so an agent can list and install any block without crawling the site.

Every block is a self-contained shadcn registry item: its own source plus every shadcn/ui primitive and sibling block it composes, bundled inline, with npm packages listed as dependencies. Blocks are organized as collection, then group, then block.

Collections sit in three tiers: Premium is the hand-built gold standard, Standard covers the large generated collections, and Free collections are open with ungated source.

## Using the registry

The whole catalog is a shadcn-compatible registry, so the shadcn CLI and any agent that reads one can list and install blocks with no vendor code.

- Registry index (every item with its file list and dependencies, but no source): https://www.shadcn-ui-blocks.com/r/registry.json
- Free registry index (the same, cut to the free collections, every item installable with no credential): https://www.shadcn-ui-blocks.com/r/free-registry.json
- A block's registry name is its collection, group, and block slugs joined by hyphens, i.e. the page path after /blocks/ with each slash replaced by a hyphen. For example /blocks/modern-saas/hero-sections/centered-with-backdrop installs as `modern-saas-hero-sections-centered-with-backdrop`.
- Install a free block by URL: `npx shadcn@latest add "https://www.shadcn-ui-blocks.com/r/{name}.json"`. Free collections are ungated and need no credential.
- Install any block by namespace: add `@shadcn-ui-blocks` to the registries map in components.json, then `npx shadcn@latest add @shadcn-ui-blocks/{name}`.
- Premium and standard collections require an API key from a Pro or Team plan. In that registries config set `"headers": { "Authorization": "Bearer ${SHADCN_UI_BLOCKS_API_KEY}" }` and put the key in your .env.local. Create and manage keys at https://www.shadcn-ui-blocks.com/account/api-keys. A request with a missing or invalid key gets a 401, and a valid key without access to the collection gets a 403, each with a JSON `message` explaining what to do.
- Every block page prints its install command in the Install section of its side rail, and the block's source is shown in the page's Code tab for a viewer with access.

## MCP server

Search the catalog in plain language from an AI assistant and install the match. The server speaks MCP over streamable HTTP at https://www.shadcn-ui-blocks.com/api/mcp, needs an API key from any account, free included, sent as an `Authorization: Bearer` header (a free key covers the free collections and the community registries, a Pro or Team key every block), and exposes four read-only tools: `search_blocks` (a natural description in, matching blocks with their install commands out, the top matches with their light and dark captures as images), `get_block` (one block by registry name, with its captures), `list_collections`, and `get_designer_file` (a Designer file from the key's workspace by name, id or URL, each page's blocks in order with their install commands). Every install command runs as it is: free and community blocks install from their registry URL, premium and standard blocks from a URL carrying a temporary token issued against the key, so nothing needs adding to components.json. Setup for Cursor, Claude Code, Codex, VS Code and any other MCP client: https://www.shadcn-ui-blocks.com/docs/mcp.

Full catalog with every block: https://www.shadcn-ui-blocks.com/llms-full.txt

## Pricing

Free to start: a free account installs every free collection and the community curation, browses the premium and standard blocks, keeps favorites and lists, tries the Designer with one file and uses MCP on the free and community blocks. Pro ($15 a month billed yearly, $20 billed quarterly) unlocks every block, unlimited Designer files, MCP on the whole catalog, the Open Graph image templates and priority support, for one person. Team ($20 a seat a month billed yearly, $25 billed quarterly) is Pro for everyone on a team with shared files, lists and roles. Templates are a one time purchase outside any plan. Plans and answers: https://www.shadcn-ui-blocks.com/pricing

## Collections

- [Modern SaaS](https://www.shadcn-ui-blocks.com/blocks/modern-saas): Explore 94 premium Modern SaaS blocks for shadcn/ui. Heroes, features, pricing, testimonials, FAQs, and CTAs with bold type and clean, sleek layouts. (Premium, 94 blocks in 21 groups)
- [Marketing](https://www.shadcn-ui-blocks.com/blocks/marketing-pro): Explore 803 Marketing blocks for shadcn/ui. Heroes, pricing, comparisons, case studies, and process pages with bold type and clean layouts. (Standard, 803 blocks in 47 groups)
- [Ecommerce](https://www.shadcn-ui-blocks.com/blocks/ecommerce-pro): Shop 858 Ecommerce blocks for shadcn/ui. Product pages, carts, checkout, reviews, promos, and tracking with bold type and clean layouts. (Standard, 858 blocks in 54 groups)
- [Application](https://www.shadcn-ui-blocks.com/blocks/application-pro): Build product UI with 785 Application blocks for shadcn/ui. Dashboards, data tables, settings, auth, billing, and onboarding, ready to wire to your data. (Standard, 785 blocks in 39 groups)
- [Portfolio](https://www.shadcn-ui-blocks.com/blocks/portfolio-pro): Build a portfolio with 752 Portfolio blocks for shadcn/ui. Heroes, work grids, case studies, about, services, and contact sections for creatives and studios. (Standard, 752 blocks in 40 groups)
- [Marketing](https://www.shadcn-ui-blocks.com/blocks/marketing): Browse 279 free Marketing blocks for shadcn/ui. Heroes, features, pricing, testimonials, FAQs, blogs, and CTAs you can copy, paste, and ship. (Free, 279 blocks in 21 groups)
- [Application](https://www.shadcn-ui-blocks.com/blocks/application): Explore 31 free Application blocks for shadcn/ui. Forms, logins, dashboards, stats, page headings, and user profiles you can drop into any product UI. (Free, 31 blocks in 7 groups)
- [Ecommerce](https://www.shadcn-ui-blocks.com/blocks/ecommerce): Shop 92 free Ecommerce blocks for shadcn/ui. Product features, lists, carts, reviews, upsells, and trust sections built to convert and ready to ship. (Free, 92 blocks in 13 groups)
- [Portfolio](https://www.shadcn-ui-blocks.com/blocks/portfolio): Discover 100 free Portfolio blocks for shadcn/ui. About, skills, case studies, services, hero showcases, and contact sections for personal and studio sites. (Free, 100 blocks in 20 groups)
- [Components](https://www.shadcn-ui-blocks.com/blocks/components): Use 124 free Components for shadcn/ui. Buttons, cards, alerts, accordions, badges, breadcrumbs, tabs, and pagination, all responsive and easy to customize. (Free, 124 blocks in 9 groups)

## Templates

Full Next.js sites assembled from the blocks, bought once with no plan required. Browse: https://www.shadcn-ui-blocks.com/templates

- [Keel](https://www.shadcn-ui-blocks.com/templates/keel): Dark SaaS marketing site. A dark minimal SaaS site with sixteen pages built from installable blocks. ($99 one time, 16 pages, live preview at https://keel-nextjs-template.vercel.app)
- [Primely](https://www.shadcn-ui-blocks.com/templates/primely): Modern SaaS starter. A clean, customizable template built to help you launch your SaaS fast. ($79 one time, 8 pages, live preview at https://primely-nextjs-template.vercel.app)

## Open Graph image templates

99 share card templates, each an ImageResponse route for Next.js or any framework satori supports, with PNG and SVG downloads in light and dark. The code is part of Pro and Team. Browse: https://www.shadcn-ui-blocks.com/open-graph-images

- [Content](https://www.shadcn-ui-blocks.com/open-graph-images/content): 15 templates
- [Product](https://www.shadcn-ui-blocks.com/open-graph-images/product): 14 templates
- [Developer](https://www.shadcn-ui-blocks.com/open-graph-images/developer): 10 templates
- [Business](https://www.shadcn-ui-blocks.com/open-graph-images/business): 15 templates
- [Events](https://www.shadcn-ui-blocks.com/open-graph-images/events): 12 templates
- [Commerce](https://www.shadcn-ui-blocks.com/open-graph-images/commerce): 12 templates
- [People](https://www.shadcn-ui-blocks.com/open-graph-images/people): 7 templates
- [Media](https://www.shadcn-ui-blocks.com/open-graph-images/media): 7 templates
- [Data](https://www.shadcn-ui-blocks.com/open-graph-images/data): 7 templates

## Docs

- [Getting started](https://www.shadcn-ui-blocks.com/docs/getting-started): install a block into any shadcn/ui project with the shadcn CLI
- [Shadcn CLI](https://www.shadcn-ui-blocks.com/docs/shadcn-cli): free blocks by URL, premium and standard blocks by namespace with an API key from a Pro or Team plan
- [MCP server](https://www.shadcn-ui-blocks.com/docs/mcp): the hosted server that searches the catalog and installs blocks from Cursor, Claude Code, Codex, VS Code or any MCP client

## Site

- [All blocks](https://www.shadcn-ui-blocks.com/blocks): search and filter the entire catalog
- [Pricing](https://www.shadcn-ui-blocks.com/pricing): Free, Pro and Team plans, and what each unlocks
- [Templates](https://www.shadcn-ui-blocks.com/templates): full site templates, bought once
- [Open Graph images](https://www.shadcn-ui-blocks.com/open-graph-images): share card templates as code
- [Designer](https://www.shadcn-ui-blocks.com/app/designer): compose pages from blocks inside the app, one file on the free plan
- [Snippets](https://www.shadcn-ui-blocks.com/snippets/buttons): color variants for shadcn/ui components
- [Changelog](https://www.shadcn-ui-blocks.com/changelog): recent releases
- [Blog](https://www.shadcn-ui-blocks.com/blog): how the blocks, the tools and the weekly drops are built
- [Support](https://www.shadcn-ui-blocks.com/support): contact and common questions
- [License](https://www.shadcn-ui-blocks.com/license): usage terms

## Blog

- [How we rebuilt block search with Jev](https://www.shadcn-ui-blocks.com/blog/how-we-rebuilt-search-with-jev): Search on Shadcn UI Blocks now understands what you describe, not just block names. Here is what changed, and searches worth trying.