21st

21st 是一个 React UI 组件库，把设计工程师做好的界面代码集中起来，供人挑选后直接搬进自己的项目。它解决的是「想要一个好看的登录框、定价表或动画首屏，但不想从零写」的问题。页面上的组件都能在线预览，看到合适的就复制提示词或安装命令，交给 Claude Code、Cursor、Codex 这类编程助手，或者用 shadcn CLI 把源码落到仓库里。

主要功能

组件按用途分类，按钮、卡片、导航、登录注册、定价区块、AI 聊天界面都有，数量以千计。除了单个组件，还有整站模板、可换色的主题、实时背景用的 shader，以及按语义搜索的图标库。每个组件都带源码，落到项目里就是自己的文件，可以照常改。

它同时面向人和 AI 代理：网页上复制提示词，或在终端里用 npx 21st add 安装；也提供 MCP 接口，让编辑器里的助手直接检索和安装。另有 Design Bug Bot，对拉取请求做对比度、间距、布局方面的检查并给出修复代码。

费用与限制

免费账户可以浏览整个库、在线打开任意组件，但每天只能复制两次提示词或安装命令，Design Bug Bot 限五次审查。付费后解除复制和安装限制，Builder 按年付每月 6 美元起，带 AI 生成的套餐每月 15 美元起，团队版按席位计。组件是 React + TypeScript + Tailwind，发布为 shadcn registry 格式，能跑在 Next.js、Vite、Remix、Astro 等任何 React 环境里。

适合谁

适合已经在用 React 和 Tailwind、想加快界面搭建速度的前端开发者，以及习惯让 AI 助手写代码、需要现成高质量素材的人。如果项目不用 React，这套东西基本用不上。