Cursor：Cursor 3 新增 Design Mode，可在浏览器中标注和定位 UI 元素
Cursor 发布 Design Mode 功能，用户可在 Cursor 3 中直接在浏览器中标注和定位 UI 元素进行编辑。
查看原文Cursor 3 上线 Design Mode，将 AI 辅助编码扩展到 UI 可视化编辑阶段——用户可直接在浏览器中标注元素、定位代码、发起修改，解决"设计稿到代码"的手动翻译痛点。这是 Cursor 继 Copilot 模式之后在端侧效率上的又一次卡位，目标用户从纯开发者向"设计+开发"混合场景延伸。
产品是什么
Design Mode 是 Cursor 3 内置的一个浏览器内嵌能力，用户打开任意网页或 Web 应用后，可以直接在视觉层面点选 UI 元素（按钮、卡片、输入框等），Cursor 会同步定位到对应的源代码行，并提供修改建议。用户无需手动搜索 DOM 或翻代码文件，标注即定位，定位即编辑。
这本质上是将"像素到代码"的逆向工程能力做进了 IDE 工作流，而不是单独拆出来做一个独立工具。
解决什么问题
传统流程中，前端开发者在拿到设计稿或需要修改现有 UI 时，往往要在浏览器 DevTools 里手动找元素、复制选择器、再切回编辑器改代码。即使有 Copilot 类辅助，"找到要改的地方"这个步骤仍是手动劳动。Design Mode 把这个查找过程压缩成一次点击。
对于迭代频繁的中后台系统、内部工具、或者需要频繁改 UI 的创业公司团队，这个功能可以显著降低"小改动"的时间成本。
目标用户
主要两类：一是需要频繁修改现有 UI 的前端开发者；二是设计和开发角色边界模糊的独立开发者或小型团队。产品经理如果想快速验证某个 UI 假设，也可以借助这个功能直接让 AI 生成修改建议。
对比同类竞品
- Figma Dev Mode
● 未登录访客SMARTFLOW PRO
继续阅读深度解读 + 编辑加注
下方还有 3-5 段深度分析 + Vincent 编辑加注 + 可点击信源，仅 Pro 会员可见
加入机智流 PRO →¥99 / 季 · 每周 1 篇深度研报 · 飞书+微信群双通道
已是 Pro 但仍被提示？联系反馈
- Cursor: Cursor 3 新增 Design Mode，可在浏览器中标注和定位 UI 元素 · 2026-04-07
- Figma Dev Mode 官方介绍 · 2025
- Vercel V0 产品页 · 2025