Cursor开发团队在代码编辑器中的浏览器(Cursor Browser)中集成了可视化编辑器,让开发者能够在同一窗口中同时查看网页界面、相关代码库与可视化调整工具。用户可以直接在渲染后的页面上拖拽元素,查看组件与属性,或通过点击并输入文字描述提出修改需求,系统代理会自动在代码库中定位对应界面的组件及相关文件,并将修改写回代码。
可视化编辑器的基本操作是拖拽调整布局,开发者可以将已显示的元素在DOM树结构中重新排序,实时尝试按钮顺序、区块排列或不同网格配置带来的版面变化。当视觉效果符合预期后,可通过提示词要求代理应用变更,代理会自动查找相关组件并同步更新代码。
针对常见的React式前端架构,Cursor还将组件状态相关的属性整合到侧边栏,方便开发者在不同组件变体间切换与对比。由于许多组件通过属性控制显示状态,例如不同尺寸、配色或交互模式,这一设计让开发者能快速识别同一组件在多种场景下的差异,并在同一界面完成调整。
在样式调整方面,侧边栏提供了滑块、调色板和实时取色器等可视化控件,开发者可基于现有的颜色令牌与设计系统,对色彩、字体和布局进行精细调节。此外,可视化编辑器还支持“点选+提示词”编辑方式,用户只需点击界面中的任意元素,用自然语言描述形状、颜色或排序等修改需求,系统代理可并行处理多个修改指令。
除了可视化编辑器,Cursor 2.2还新增了多项与代理工作流相关的功能,包括调试模式,可通过运行时日志辅助重现问题并定位原因;计划模式更新支持在计划中嵌入Mermaid图表,并可将选定的任务分配给新的代理处理;此外还引入了多代理评估机制,多个并行代理完成任务后,系统会自动评估各方案并推荐最优解,同时附上选择依据。