---
title: "A visual editor for the Cursor Browser"
description: "Cursor has released a visual editor for its Browser that combines a web app, codebase, and visual editing tools in one window. Users can drag rendered elements across the DOM tree, inspect React component props, adjust styles and design-system color tokens, and interactively test layout, typography, and component variants. Point-and-prompt interactions let users select interface elements and describe changes such as resizing, recoloring, or reordering; agents run these prompts in parallel and make changes live within seconds. Once a visual arrangement is settled, the agent locates relevant components and updates the underlying code. The release positions the editor as a way to connect visual design and coding more directly, with features documented for Cursor 2.2."
---

# A visual editor for the Cursor Browser

[Cursor](https://yomu.fyi/company/cursor) · Jason Ginsberg & Ryo Lu · Dec 11, 2025

**Type:** Announcement

## Summary

Cursor has released a visual editor for its Browser that combines a web app, codebase, and visual editing tools in one window. Users can drag rendered elements across the DOM tree, inspect React component props, adjust styles and design-system color tokens, and interactively test layout, typography, and component variants. Point-and-prompt interactions let users select interface elements and describe changes such as resizing, recoloring, or reordering; agents run these prompts in parallel and make changes live within seconds. Once a visual arrangement is settled, the agent locates relevant components and updates the underlying code. The release positions the editor as a way to connect visual design and coding more directly, with features documented for Cursor 2.2.

## Context

The editor is intended to close the gap between design and code by making interface changes more immediate and intuitive while reducing context switching.

## Approach / What changed

The visual editor combines rendered interface manipulation, DOM-tree drag-and-drop, React prop controls, interactive styling tools, and point-and-prompt agent workflows. After visual changes are selected, the agent identifies relevant components and updates the underlying code.

## Takeaways

- Rendered elements can be rearranged directly across the DOM tree, enabling changes to button order, section rotation, and grid configurations.
- The sidebar surfaces React component props and provides controls for color tokens, palettes, grids, flexbox layouts, typography, and live previews.
- Users can issue prompts on multiple selected elements, with agents running requests in parallel and applying live changes within seconds.

**Tags:** [Cursor](https://yomu.fyi/topic/cursor), [Developer Experience](https://yomu.fyi/topic/developer-experience), [React](https://yomu.fyi/topic/react)

- Source: [Cursor](https://cursor.com/blog/browser-visual-editor)
- Source URL: https://cursor.com/blog/browser-visual-editor
- Ingested by Yomu: 2026-09-02T11:45:03.337Z

[Read original post](https://cursor.com/blog/browser-visual-editor)