shadcn.io is an independent project built on shadcn/ui
The 
shadcn library your AI agent builds with.
shadcn6,231 blocks, 14 templates and 175 components for React, Vue, Svelte and Solid. Ask your agent, and it installs them in your theme.
The world's largest shadcn block library
6,231 blocks, from the hero to the settings page, designed as one system: responsive, accessible, light and dark, and in your theme, for React, Vue, Svelte and Solid.
Used by 100k devs and across top universities.
- Harvard UniversityCambridge, MA
- University of California, BerkeleyBerkeley, CA
- Carnegie Mellon UniversityPittsburgh, PA
- Cornell UniversityIthaca, NY
- University of California, Los AngelesLos Angeles, CA
- University of WashingtonSeattle, WA
- University of Illinois Urbana-ChampaignChampaign, IL
- Dartmouth CollegeHanover, NH
Campus photos from Wikimedia Commons: credits
- Harvard: Wgreaves (CC BY-SA 4.0), Daderot (CC BY-SA 3.0), chensiyuan (CC BY-SA 4.0)
- Berkeley: Falcorian (CC BY-SA 4.0), Bob Collowan (CC BY-SA 3.0), Carol M. Highsmith, Library of Congress (Public domain)
- CMU: Dllu (CC BY-SA 4.0), Jared Luxenberg (CC BY-SA 3.0), Dllu (CC BY-SA 4.0)
- Cornell: Russian Elmo (CC BY-SA 4.0), Eustress (CC BY-SA 4.0), sach1tb (CC BY-SA 2.0)
- UCLA: Coolcaesar (CC BY-SA 3.0), Logan Ward (CC BY 2.0), Alton (CC BY-SA 3.0)
- UW: Ken Lund (CC BY-SA 2.0), Keng Susumpow (CC BY 2.0), Punctured Bicycle (Public domain)
- UIUC: Dori (CC BY-SA 3.0 us), HalloweenHJB (CC BY 3.0), Kevin Dooley (CC BY 2.0)
- Dartmouth: Kane5187 (Public domain), Kane5187 (Public domain), Daderot (Public domain)
Premium shadcn templates, ready to launch
Hand-built sites for startups, SaaS, agencies and portfolios, every page designed and built with Next.js, Tailwind CSS and shadcn/ui. Yours to edit and ship, included with Pro.
Built with shadcn.io
100k+ devs are building with shadcn.io components.
- Fetchtalent AIfetchtalent.ai
- InfoSignal Inc.infosignal.com
- TextbookLMtextbooklm.co
- Toonly AItoonly.ai
- Lexosgolexos.com
- Skilluraskillura.com
- InfoBoardifs-infoboard.com
- Meeting IQmeetingiq.com
Build yours next. Pro has every block and template, ready to ship.
Get ProThe shadcn MCP server for every AI agent
Claude Code, Cursor, VS Code and 35 more. Connect once, then ask your agent for any component: it arrives in your framework, typed, accessible and in your theme. Included with Pro.
shadcn/ui for React, Vue, Svelte and Solid
The same components, one design and one theme on every framework. React runs on Base UI, Radix, React Aria or Ark UI; the others on Ark UI.
DESIGN.md files for 500 brands
Stripe, Linear, Apple and 497 more: each brand's colors, typography and components in one file your AI agent builds from. Free to download.
175 free shadcn/ui components
From Button to Date Picker to a guided Tour, accessible, typed in TypeScript and styled with Tailwind CSS v4, each with live demos and the code. Free with an account.
1,103 shadcn/ui examples, ready to copy
Charts, forms, menus and more, in 53 galleries: real-world patterns built from the components, each live with its code. Free with an account.
35 typed React hooks for every interface
Debounce, local storage, media queries and more: each hook one TypeScript file you copy in and own. Free with an account.
Every premium block and template, one Pro plan
Every block, all 14 premium templates, the MCP server and the Pro animated components, for you or your whole team. Monthly, yearly or lifetime.
4.9/5 out of 5 · 150+ reviewsfrom 150+ founders and developers.
- Secure checkout via Stripe
- Code lives in your repo
- Keep what you've shipped if you cancel
- License terms
Devs love shadcn.io
Rated 4.9 out of 5 from 150+ reviews. 100k+ developers build with shadcn.io; here's what they say.
Danny G.Founder of DevStack“shadcn.io templates have completely transformed how we approach new client projects. The code quality is exceptional and the designs are truly world-class.”
Ibrahim S.Frontend Lead @ ScaleUp“shadcn.io templates strike the perfect balance between aesthetics and functionality. A real game-changer for our projects.”
Alan Obeng-PeprahSenior Designer @ NativeXAI“Beautiful landing page design with perfect balance and flow. The color palette combined with the animations creates an exceptional user experience.”
Garrett P.Frontend Lead at TechFusion“I appreciate how modular and well-documented these components are. We've been able to mix and match pieces from different templates seamlessly.”
Ian D.CTO at Wavelength“I've used many template libraries before, but shadcn.io stands out for its attention to performance optimization and clean code architecture.”
Abiola BraimahDeveloper @ Studio IX“The templates are not just visually stunning but also incredibly well-structured. Saved us weeks of development time.”
Hallic M.Developer @ AtlasLabs“These templates have become our go-to resource. The code is clean, well-documented, and easily customizable.”
Acromond X.Co-founder @ VectorlabsVentures“Outstanding quality and attention to detail. The responsive design works flawlessly across all devices.”
Frequently asked questions
What shadcn.io is and which stacks it runs on, how accessible it is, and what Pro adds.
What is shadcn.io?
Is this the official shadcn/ui?
How do I install a component?
Do I need an account?
Which frameworks are supported?
Base UI, Radix, React Aria or Ark UI: which one?
Is it TypeScript and Tailwind?
Are the components accessible?
Do they support right-to-left languages?
Do animations respect reduced motion?
What's free?
What does Pro add?
Can I use Pro in commercial projects?
4.9 out of 5 from 150+ developers
Ship a polished product, faster
The components are free for React, Vue, Svelte and Solid. Pro adds every block, the premium templates and the MCP server: monthly, yearly or lifetime.
- Cancel anytime
- Keep what you've shipped