21st.dev 是一个面向 React 开发者的 shadcn 组件注册表目录站,它把散落在 GitHub 上的 shadcn 生态资源集中收录,目前追踪了 300 多个注册表,并精选整理出 12,000 多个组件。你可以在站内按 Stars、最近提交、首次提交等维度排序浏览,也能按设计系统、营销 UI、仪表盘 UI、AI 区块、表单、动效、图表、图标、电商 UI、认证、支付、地图、文本编辑器、视频、音频、加载器、3D、Web3、文档 UI、终端 UI、React Native 等分类筛选。每个注册表都标注了组件数量、GitHub 星标与最近提交时间,并提供仓库与官网入口,方便你快速判断项目是否活跃、是否值得引入。
痛点是什么
shadcn/ui 本身只提供基础组件,真正让界面出彩的动效、图表、AI 聊天、地图、富文本编辑器等能力,都分散在成百上千个第三方注册表里。开发者想找一个合适的组件,往往要在 GitHub 搜索、掘金文章、X 推文之间来回跳转,逐个点开仓库看星标、看提交时间、看是否还在维护,效率极低。更麻烦的是,很多注册表只支持命令行安装,遇到不兼容或停更的项目,排查成本很高。信息碎片化、质量参差不齐、缺少统一对比入口,是 shadcn 用户最真实的困扰。
主要功能特点
21st.dev 把 shadcn 注册表的发现、筛选与引入整合到一个目录里,让开发者用更短路径找到可用组件。
300+ 注册表统一收录
把散落各处的 shadcn 注册表集中到一个可搜索目录,省去跨站翻找。
按分类与星标排序
支持按 UI 场景分类浏览,也能按 Stars、提交时间排序,快速判断质量。
提示词复制给 AI 智能体
复制组件提示词粘贴到 Claude、Codex、Cursor,即可加入你的应用。
为什么值得关注
对重度使用 shadcn/ui 的前端团队来说,21st.dev 相当于一份持续更新的组件地图,既节省选型时间,也降低踩坑概率。
数据维度足够透明
星标、组件数、最近提交时间一目了然,活跃度与维护状态可直接判断。
与 AI 编程工作流打通
提示词可直接喂给 AI 智能体,让组件引入从手动安装变成对话式操作。
GitHub 上星标最多的 @shadcn 注册表,排名如下 👇
我们追踪了全部 300+ 个 shadcn 注册表,并精选出最优秀的,整理成 12,000+ 个组件,收录在我们的 21st 合集中
1. supabase ★ 111k 连接 Supabase 的区块
2. magicui ★ 22k 动画组件
3. agents-ui ★ 21k LiveKit 智能体界面
4. plate ★ 17k AI 富文本编辑器
5. react-aria ★ 16k 可访问的自适应组件
6. assistant-ui ★ 12k AI 聊天基础组件
7. mapcn ★ 12k 地图组件
8. coss ★ 11k 基础 UI 组件
9. openstatus ★ 9.1k 状态页面组件
10. motion-primitives ★ 6.4k 动效组件
将任意组件的提示词复制粘贴到你的 AI 智能体(claude/codex/cursor)中,即可添加到你的应用
全部 336 个注册表的完整目录及更多内容见下方 ↓
https://21st.dev/community/shadcn-directory?utm_source=x&utm_campaign=brdwnr&utm_content=list_stars