Startseite / Tutorial · ✦ Offiziell

Cursor Browser Visual Editor — Design Mode für deine Live-App

Cursor Team · Cursor Blog ·

Der offizielle Visual Editor von Cursor verwandelt die Browser-Vorschau in eine Design-Oberfläche: Drag-and-Drop-Layout-Bearbeitung im DOM, ein Figma-ähnlicher Inspector für Abstände, Farben, Typografie und Design Tokens, React-State-Schalter und ein Point-and-Prompt-Workflow, den ein Agent direkt in echten Code übernimmt.

Zusammenfassung des Herausgebers

The visual editor brings web app, codebase, and visual editing into one window — edit your live app directly, then let the agent persist the changes as real, reviewable code.

In diesem Artikel

  • Drag-and-drop layout editing across the DOM tree
  • Visual style controls: spacing, color, typography, shadows, radius
  • Design tokens and design-system integration
  • React component state testing (loading, error, disabled)
  • Point and prompt: describe a change in natural language
  • The Apply step: client-side overrides become real code

Source: Cursor Blog

Original lesen Der Inhalt befindet sich auf der Website des ursprünglichen Herausgebers.
Kuratiert für die Cursor-Design-Community als hauseigene Referenz zum Designen mit Cursor.