Direct agents with visual prompts in Design Mode
Cursor's Design Mode lets you prompt agents visually in a running app: click or multi-select elements, draw annotations on a frozen frame, or narrate by voice; the agent gets each element's xpath, props, and styles.
**The gist** Cursor updated **Design Mode** (**June 5, 2026**) in the Agents Window: click or **multi-select** elements in your running app, draw annotations on a frozen viewport frame, or narrate changes by voice. A selection captures the element's xpath, component, attributes, computed styles, and **fiber-tree props**, plus a screenshot for layout context.
**Why it matters** UI work is where text prompts leak the most precision — a vague description like the second button in the header becomes an exact **element reference** with styles and props attached. Combined with **hot reload**, it tightens the describe-fix-verify loop for frontend agent tasks.
**The gist** Cursor updated **Design Mode** (**June 5, 2026**) in the Agents Window: click or **multi-select** elements in your running app, draw annotations on a frozen viewport frame, or narrate changes by voice. A selection captures the element's xpath, component, attributes, computed styles, and **fiber-tree props**, plus a screenshot for layout context. **Why it matters** UI work is where text prompts leak the most precision — a vague description like the second button in the header becomes an exact **element reference** with styles and props attached. Combined with **hot reload**, it tightens the describe-fix-verify loop for frontend agent tasks. **Watch out** It's tuned for **Composer 2.5** and needs the **Cursor browser** in the Agents Window, so this is a Cursor-stack feature rather than a portable pattern. Cursor gives **no metrics** on accuracy or speed gains.