Creative Tim UI

Creative Tim UI 是一个基于 shadcn/ui 构建的综合组件库，旨在帮助你更快速地构建现代 Web 应用程序。

概览

Creative Tim UI 提供预构建、可自定义的 React 组件和区块，专为打造美观、生产就绪的 Web 应用程序而设计。通过 CLI，你可以轻松地将这些组件添加到你的 Next.js 项目中。

安装

你可以直接使用 npx 运行 Creative Tim UI CLI，也可以将其全局安装：

# 直接使用（推荐）
npx @creative-tim/ui@latest add 

# 或者使用 shadcn cli
npx shadcn@latest add https://creative-tim.com/ui/r/all.json

前置要求

在使用 Creative Tim UI 之前，请确保你的 Next.js 项目满足以下要求：

• Node.js 18 或更高版本
• 项目中已初始化 shadcn/ui (npx shadcn@latest init)
• 已配置 Tailwind CSS

使用方法

安装所有组件

一次性安装所有可用的 Creative Tim UI 组件：

npx @creative-tim/ui@latest add all

该命令将执行以下操作：

• 如果尚未配置，则设置 shadcn/ui
• 将所有 Creative Tim UI 组件安装到你配置的组件目录中
• 将必要的依赖项添加到你的项目中

安装特定组件

使用 components add 命令安装单个组件：

npx @creative-tim/ui@latest add 

示例：

# 安装 card 组件
npx @creative-tim/ui@latest add card

替代方案：配合 shadcn CLI 使用

你也可以使用标准的 shadcn/ui CLI 安装组件：

# 安装所有组件
npx shadcn@latest add https://creative-tim.com/ui/r/all.json

# 安装特定组件
npx shadcn@latest add https://creative-tim.com/ui/r/button.json

所有可用组件可以在这里找到，或者点击这里浏览示例区块列表。

区块 (Blocks)

探索我们按类别组织的现成区块集合。每个区块都完全可自定义，只需一条命令即可添加到你的项目中。

应用程序 UI (Application UI)

• 模态框 (Modals)：5 个区块
• 账户 (Account)：7 个区块
• 账单 (Billing)：5 个区块

营销 (Marketing)

• 评价板块 (Testimonial Sections)：17 个区块
• 联系板块 (Contact Sections)：15 个区块
• 页脚 (Footers)：16 个区块
• 常见问题解答 (FAQs)：6 个区块
• 博客 (Blog)：15 个区块

电商 UI (Ecommerce UI)

适用于产品列表、购物车和结账流程的现成区块。

• 电商板块 (Ecommerce Sections)：14 个区块

Web 3.0

为去中心化应用、区块链项目和加密货币平台构建的创新板块。

• Web 3.0 卡片 (Web 3.0 Cards)：5 个区块

贡献

如果你想为 Creative Tim UI 做出贡献，请遵循以下步骤：

1. Fork 本仓库
2. 创建一个新分支
3. 在 registry 中对组件进行修改
4. 向主分支发起 PR

请阅读贡献指南。

版权与许可

Creative Tim UI 建立在开源社区的杰出工作之上：

• shadcn/ui - 文档结构、注册表系统和基础（原子）组件来自 shadcn/ui 的开源工作。MIT 许可协议
• Material Tailwind by Creative Tim - 区块和组件设计灵感来源于并基于 Material Tailwind 框架。MIT 许可协议
• Eleven Labs UI - 文档结构和区块构建方法的一般灵感来源。MIT 许可协议
• Geist Font by Vercel - 界面中使用的优美字体。SIL Open Font License 1.1

我们非常感谢这些项目将其工作以开源许可形式提供。

许可

采用 MIT 许可协议授权。

由 Creative Tim 倾心制作。