Visual edit

​

Getting started

​

Edit text

Modify text content directly in the preview.

1. Select an element containing text.
2. Click Edit text.
3. Type your new text content.
4. Press Enter for a new line, Save changes, or click outside to close the text editor.

​

Edit style

Change colors, fonts, alignment, weight, and other visual styles for elements.

1. Select an element.
2. Click Edit style.
3. Adjust the style properties you want to change.
4. Changes appear automatically as you adjust them.
5. Press Save changes.

​

Edit spacing

Adjust padding, margin, and layout spacing for elements.

1. Select an element.
2. Click Edit spacing.
3. Adjust padding and margin values.
4. Changes apply automatically.
5. Press Save changes.

​

Edit image

Replace or modify images in your project.

1. Select an image element.
2. Click Edit image.
3. Upload a new image or modify image properties.
4. Changes apply automatically.
5. Press Save changes.

​

Delete element

Remove elements from your project.

1. Select the element you want to remove.
2. Click Delete element.
3. Confirm the deletion.
4. Press Save changes.

​

Go to code

Jump to the code view for the selected element to make more advanced changes.

1. Select an element.
2. Click Go to code.
3. The code view opens showing the code for that element.
4. Press Save or Discard to apply your changes.

​

Edit multiple elements

Edit multiple elements before saving to batch your changes and apply them all at once.

1. Click the first element and use the editing tools to make your changes.
2. Don’t save yet. Click another element in the preview.
3. Use the editing tools to make changes to that element.
4. Repeat for as many elements as needed.
5. All changes are saved together automatically.

Each element keeps its own changes. For example, you can change a card’s background color using Edit style, update a heading’s text using Edit text, and adjust a button’s padding using Edit spacing all in one batch.

​

Ask for quick changes

With an element selected, use the Ask for quick changes tool to make modifications using natural language. No need to use specific tools or dropdowns.

1. Select an element in the preview (or keep your current selection).
2. Click Ask for quick changes.
3. Type your change request in plain English.
4. Press Enter or click the send button.

Examples:

• Make the selected button orange with white text and rounded corners.
• Set this heading to bold, center aligned, 32px font size.
• Add 24px padding and a subtle box shadow to this card.
• Change the background to a gradient from blue to purple.
• Make this text italic and change the color to gray.
• Remove the border and add 8px border-radius to this image.

You can combine multiple properties in one command.

​

What’s next?