Shadcn UI Kit 是一套面向开发者与设计者的界面资源集合,官方定位是帮助用户减少从零搭建界面的时间,更快启动项目。其内容由多个部分组成:管理后台仪表盘、网站模板、可复用组件、生产级 UI 区块、真实场景示例,以及 Figma 设计系统。
用途方面,官方称可用于构建管理后台、SaaS 应用、落地页或在线商店。它提供 16 个生产可用的管理后台仪表盘、17 个 Web 应用模板、40 多个额外页面和 100 多个可复用组件,并配有预构建区块与真实世界示例,用于覆盖常见 UI 模式,减少重复开发。
主要能力方面,所有组件同时支持 Radix UI 与 Base UI。模板和组件完全兼容 React,可集成到 Vite、Next.js、Remix 或 TanStack Start 等基于 React 的框架。网站模板由 Next.js 和 Astro 构建,官方称其已完整设计并达到生产可用状态。另有一系列动画 bento 卡片、动效和交互式 UI 插图,基于 shadcn/ui、Motion 和 Tailwind CSS,可通过复制粘贴或 CLI 安装。官方还提供从区块搭建多页站点并导出干净 Next.js 代码的工具,以及主题设计工具,两者使用相同的 shadcn/ui 组件,便于将设计接入现有项目。
技术栈方面,官方说明 Shadcn UI Kit 使用 Next.js 16、React 19、Tailwind CSS v4 和 TypeScript 构建。Figma 文件包含 16 个管理后台、Web 应用、550 多个区块和完整的 shadcn/ui 组件库;每个界面均提供桌面、平板和移动端布局,以及明暗两种模式,基于 Tailwind CSS v4 变量。官方称 Figma 屏幕与代码使用相同组件、令牌和断点,设计稿可对应到相同页面。
使用方式上,用户购买后会收到包含登录链接的邮件,可创建个人密码并访问账户内容。CLI 安装与复制粘贴是组件的两种获取方式。Figma 文件包含在 Pro、Team 和 Enterprise 套餐中,购买后可在账户的 Tools 区域一键复制到自己的 Figma 账户。
收费与授权方面,官方称付费为一次性支付,终身使用,无订阅、无隐藏或循环费用。价格已含增值税;以公司名义购买可在结账时填写 VAT ID 以免税。支付通过 Paddle 处理,支持主要信用卡(Visa、Mastercard、AMEX)、PayPal、Google Pay 和 Apple Pay。官方称购买后一般不予退款,但若因代码本身导致技术问题,可提交详细信息和证明申请例外退款。授权允许构建无限数量项目,包括付费 SaaS 应用,但不得用于制作网站构建器、模板市场或允许他人直接使用其组件建站的工具;可用于单一客户项目,但未经实质修改不得转售或再分发给多个客户。不得将付费组件或模板用于源码公开的开源项目,仅可用于闭源项目。无需署名或回链。学生和非营利组织可参与限时折扣活动。
支持与更新方面,官方称支持由 Shadcn UI Kit 的实际创作者处理,通常在 48 个工作小时内回复,覆盖组件、区块和模板的使用问题;可通过网站实时聊天或邮箱 hello@tobybelhome.com 联系。官方称每周会有重要更新,持续新增组件和模板,并根据用户反馈安排更新优先级。用户也可通过实时聊天或邮件请求新组件。
限制与注意事项:官方未在资料中说明具体的套餐价格与各套餐详细差异,仅提到有开源免费版、面向独立开发者、成长型初创公司以及代理机构与企业等套餐,具体价格暂未提供。免费试用方面,官方表示在 GitHub 账号发布了若干免费项目,可用于了解代码质量与架构,但未说明独立的免费试用机制。自定义方面,官方在 FAQ 中有“Can I customize it?”标题,但未提供对应说明内容。用户数据与官方文本中不包含编造的额外功能或平台支持信息。