CURSOR : enfin un éditeur figma-like

https://cursor.com/blog/browser-visual-editor

📌 CURSOR ajoute aujourd’huiàa ses features, un « Visual Editor », entendez par la figma-like, pour rendre la création d’interfaces plus immédiate, plus fluide et plus intuitive. L’outil réunit dans une même fenêtre l’application web, le code et un éditeur visuel complet. Chaque élément devient manipulable directement, sans changement de contexte, et réduit ainsi encore un peu plus la frontière entre design et code !

Le déplacement d’éléments, l’inspection des composants ou l’ajustement de propriétés se font en un clic. La frontière entre design et code se réduit, offrant un environnement où les interfaces prennent forme de manière naturelle pour les designers.

Au cœur de l’éditeur, la structure d’un site peut être réagencée par simple glisser-déposer.
Les sections se déplacent, les boutons se réordonnent, les grilles se testent instantanément.
Une fois la disposition souhaitée obtenue, l’agent applique automatiquement les modifications au code source.

Au fil de l’exploration, les propriétés des composants apparaissent dans une barre latérale dédiée. Chaque variable devient ajustable, facilitant la visualisation d’états multiples ou de comportements conditionnels.

Les styles gagnent aussi en précision grâce aux contrôles visuels intégrés.
Couleurs, typographies, flexbox ou grilles se modifient avec des curseurs et sélecteurs interactifs qui prévisualisent les effets en temps réel.

🔹 Points essentiels :

• 🧩 Glisser-déposer pour réorganiser la structure
• 🎛️ Ajustements visuels précis des styles et mises en page
• 🔍 Inspection directe des composants et de leurs propriétés
• ✍️ Interaction « point and prompt » pour décrire les changements
• ⚡ Agents parallèles appliquant les modifications en quelques secondes
• 🔗 Unification entre conception visuelle et code

L’éditeur permet également de cliquer sur n’importe quel élément et de décrire l’action souhaitée (point and prompt). Il suffit d’indiquer « agrandir », « rendre rouge » ou « inverser l’ordre », et l’agent applique la transformation immédiatement.

Cette approche élève l’abstraction et rapproche l’expression d’une idée de son exécution technique. La création devient plus directe, plus expressive, moins entravée par les aspects mécaniques du développement. Ce nouvel éditeur représente une étape vers des agents capables de participer encore plus profondément à la construction d’applications web.

Les Browser docs présentent l’ensemble des nouveautés introduites avec Cursor 2.2.