Visual edit
Also called visual editor or click to edit
Changing an app by pointing at an element in its preview and describing the change right there, so the AI knows exactly which part you mean.
Restyle the selected button as the primary action: green background, 12px corner radius, 16px horizontal padding, and a slightly darker green on hover. Keep its label and click behavior, and apply the same style to the matching button on the pricing page.
Paste into Layerwise or any AI coding tool.
What is Visual edit?
With a visual edit, you click a button, heading, or card in the preview and say what should change, such as "make this green" or "add more space above it." The tool tells the AI which element you picked, often with its source file and line, so it edits the right thing.
Some tools also let you adjust text, colors, or spacing directly and write the change back to the code. Others let you draw on a capture of the page to point at problems that span several elements.
Visual edits suit small, targeted changes to what you can see. For behavior, data, or changes across many pages, a written prompt is clearer. In Layerwise, Grab page element in the preview toolbar attaches the element you click, with its text, styles, and source location, to your next message.
Related terms
All termsLive preview
A running copy of your app beside the code or chat that updates as soon as a file is saved, so you see each change without reloading.
Prompt
The instruction you give an AI model. In AI coding tools, the prompt describes what to build or change, and its detail shapes the result.
Vibe coding
A way of building software by describing what you want to an AI model and steering the result in conversation, without writing the code yourself.
Context window
The amount of text an AI model can consider at once, including your messages, its replies, and the files it reads, measured in tokens.
Build it with Layerwise
Describe your app, watch it run in a live preview, and publish it with a database, storage, and sign-in built in.