连接本地编程智能体，使用你自己的模型密钥，或从 OpenDesign Cloud 开始。应用可复用的设计系统，生成并审查响应式前端，然后保留项目文件，继续后续工程工作。
本地智能体 · 自带密钥 · OpenDesign Cloud
精致的品牌网站，配备杂志风格的视觉呈现、响应式页面，以及可供工程审查的源文件。
探索住宿体验
“一个精致的酒店网站，拥有清晰的预订路径、沉浸式视觉叙事、可复用组件，以及编程智能体可以持续遵循的设计系统。”
开发者为各种受众构建网站。OpenDesign 围绕品牌和访客任务塑造可见结果，然后将结果连接到设计规则、本地文件和开发者工作流。
开发者可能正在构建酒店、电商、编辑、作品集或产品网站。OpenDesign 会根据具体任务调整视觉方向。开发者价值体现在结果背后：可控的模型、可复用的设计规则、响应式审查，以及仍属于工程工作流一部分的本地文件。
生成前先选择设置：使用本地编程智能体访问项目文件，使用自己的密钥直接控制模型，或在 OpenDesign Cloud 中开始，无需配置前两者。
通过已安装的编程智能体运行 OpenDesign，例如 Codex、Claude Code 或 Cursor。当智能体需要读取和编辑本地项目时，应使用这种方式。
Codex
Claude Code
Cursor添加提供商密钥、端点和模型，然后在生成前测试连接。使用费用由提供商收取，不会消耗 OpenDesign 积分。
登录并使用 OpenDesign Cloud 中提供的托管模型。当你想在配置本地开发工作流之前先开始设计时，这是最简便的设置方式。
同一产品，不同控制方式。 本地智能体和 BYOK 无需 OpenDesign 账户即可开始。OpenDesign Cloud 使用账户和方案积分。你选择的智能体或模型提供商仍可能单独收费。
OpenDesign 负责设计生成层，然后将前端交回工程工作流，由后者负责审查、重构、集成和部署。
当需要编辑文件时连接本地编程智能体；使用自己的密钥直接访问模型；或登录 OpenDesign Cloud，开始使用托管模型。
从 152+ 个开源系统中选择，或根据网站、GitHub 仓库或 Figma 文件创建自己的系统。
说明受众、页面、品牌方向和技术限制。审查响应式结果，然后通过提示词或直接选择进行优化。
将本地项目作为实现材料：查看它，将其纳入版本控制，进行测试和重构，并连接技术栈的其余部分。
保留已批准的设计系统。将重复出现的导航、首屏和页脚拆分为符合代码仓库规范的可复用组件。展示发生更改的文件；未经说明不要添加依赖。
有用的输出不只是渲染结果，而是响应式网站、可检查的项目材料，以及下一次智能体执行可以复用的设计规则的组合。
生成真实的网站页面和可复用区块，而不是得到一张扁平截图，或一份必须重新构建的视觉参考。
将 HTML、CSS、相关资源和项目结构保留在你的电脑上，让结果能够进入常规版本控制和审查流程。
保留选定的颜色、字体、间距和组件规则，作为下一页面及下一次编程智能体执行的共享上下文。
从 152+ 个开源设计系统中选择，或根据网站、GitHub 仓库或 Figma 文件创建设计系统。OpenDesign 将颜色、字体、间距和组件决策转化为可复用的上下文，为每个生成页面提供指导。
使用明确的视觉系统，而不是让模型根据少量形容词凭空创造新风格。
使用网站、GitHub 仓库或 Figma 文件作为项目专属设计系统的源材料。
将可复用的设计规则和项目文件放在一起，让后续编程智能体工作从更多内容开始，而不只是从一张截图开始。
优化文案、布局、组件和新页面，同时持续遵循相同的视觉决策。
模型设置、项目文件权限和生产就绪状态是不同的决策。受支持的发布集成仍需要部署提供商和配置。
OpenDesign 是开发者工作流中的设计生成层，而不是全栈应用平台。应将生成的前端视为实现材料，仍需进行审查、测试、无障碍检查、安全处理，并根据代码仓库标准进行调整。
提供商设置、本地智能体访问、设计系统输入，以及你可以继续开发的项目文件。
可以。添加你的提供商 API 密钥、端点和模型，然后测试连接。模型使用费用由提供商直接收取，因此不会消耗 OpenDesign 积分。BYOK 可以生成设计，但不会自行编辑项目文件；需要文件访问权限时，请使用本地编程智能体。
使用本地编程智能体或自带密钥工作流时不需要。OpenDesign Cloud 使用托管模型和方案积分，因此需要账户。
本地编程智能体可以处理其有权限访问的文件，因此适合在现有代码仓库中调整生成的前端工作。发布前请审查更改，并使其符合你自己的框架、测试和规范。
你可以从 152+ 个开源设计系统中选择，也可以根据网站、GitHub 仓库或 Figma 文件创建一个系统。生成的颜色、字体、间距和组件方向可以指导网站及后续迭代。
OpenDesign 会创建一个可供你检查和继续开发的网站前端。你可以导出独立 HTML 或可用的源文件和资源，也可以使用 PDF 或图像进行审查。已配置的 Cloudflare Pages 或 Vercel 集成可以发布受支持的输出；提供商账户、基础设施、后端服务和生产检查仍由你负责。
选择运行方式，应用可复用的设计系统，审查响应式前端，然后继续使用本地项目文件。
下载 OpenDesign免费且开源 · 无厂商锁定 · 可与编程智能体配合使用
