Stitch是什么?
Google 推出的新一代 AI 设计工具,可从文本或图像输入,在数分钟内生成高质量的桌面端与移动端 UI 设计及前端代码,并支持便捷的设计调整与导出到 Figma。
可解决的业务课题
「Stitch」的服务详情
使用方法
-
注册账号
在官方网站点击「Try Stitch」按钮,使用 Google 账号登录。
-
输入提示词或上传图片
用英文输入想要创建的 UI 概述,或上传手绘草图、截图等参考图片。
-
查看设计方案
预览 Stitch 生成的多个 UI 设计方案,选择最符合需求的版本。
-
微调设计
调整主题、配色、布局等细节,根据需要重新生成。
-
导出代码或设计文件
将完成的设计导出为 HTML/CSS 代码,或粘贴到 Figma 中进行进一步编辑。
-
集成到项目中
将导出的代码或设计整合到现有项目中,继续推进开发。
功能
-
自然语言生成 UI
通过英文文字提示词,自动生成适用于移动端或 Web 端的 UI 设计及对应的前端代码。
-
图片驱动的 UI 生成
上传手绘草图或现有 UI 截图,即可生成对应的设计与代码。
-
多版本设计方案
同时生成多个不同布局和风格的设计方案,便于对比和选择。
-
主题与样式自定义
可调整配色、字体、组件样式等,打造符合品牌或项目风格的设计。
-
导出至 Figma
将生成的设计直接粘贴到 Figma,支持团队协作和与现有设计系统集成。
-
导出 HTML/CSS 代码
将生成的 UI 对应的整洁 HTML/CSS 代码导出,直接用于开发。
-
由 Gemini 2.5 Pro 驱动
基于 Google 最新 AI 模型 Gemini 2.5 Pro,实现高质量的 UI 设计和代码生成。
-
功能持续更新中
即将支持对截图添加注释进行 UI 编辑,以及同时生成适配移动端与 Web 端的设计。
定价
| Stitch(Google Labs) | |
|---|---|
| 使用费用 | 免费 |
| 使用条件 | 需要 Google 账号 |
| 支持语言 | 仅英语 |
| 导出格式 | HTML/CSS、Figma |
| 使用限制 | 无(实验性功能) |
试用Stitch





