创建你的第一个项目

🌐 Creating Your First Project

本教程将指导你在 Onlook 中创建第一个项目。

🌐 This tutorial will guide you through creating your first project in Onlook.

步骤 1：创建一个新项目

🌐 Step 1: Create a New Project

1. 打开 Onlook
2. 在欢迎界面点击“新建项目”
3. 选择一个模板或从头开始
4. 为你的项目输入名称
5. 点击“创建”

步骤 2：探索界面

🌐 Step 2: Explore the Interface

花点时间探索 Onlook 界面：

🌐 Take some time to explore the Onlook interface:

• 画布：显示并与组件交互的主要区域
• 图层面板：显示组件层级
• 属性面板：编辑所选组件的属性
• 样式编辑器：修改 Tailwind 样式
• 代码面板：查看和编辑生成的代码

第三步：添加组件

🌐 Step 3: Add Components

1. 点击工具栏中的“+”按钮
2. 从库中选择一个组件
3. 将它拖到画布上
4. 使用属性面板进行自定义

步骤 4：为组件添加样式

🌐 Step 4: Style Your Components

1. 在画布上选择一个组件
2. 使用样式编辑器应用 Tailwind 类
3. 调整间距、颜色、排版和其他属性

步骤5：预览并导出

🌐 Step 5: Preview and Export

1. 点击“预览”查看你的项目效果
2. 做最后的调整
3. 点击“导出”以导出你的项目
4. 选择导出选项（代码、图片等）