Select to edit

Quickly target any element in your live preview for focused edits—no manual selector hunting required.

---

How It Works

1

Activate Select to Edit

Click the 🎯 “Select to Edit” icon in the prompt box toolbar.

2

Pick an Element

Click the element in the preview pane you want to modify. Maker highlights it and inserts a reference placeholder (e.g. [selected element]) into the prompt.

3

Write Your Prompt

Describe the change you’d like to make to that element. For example: Change the selected element’s background to a glassmorphism blur and set its border-radius to 12px.

4

Run & Apply

Press Enter (or click on the arrow). Maker updates only that element’s code, leaving the rest of your project untouched.

---

Examples

Change

Styling

Step 1

Select a button.

Step 2

Prompt: “Make the selected element’s text uppercase”

Change

Content

Step 1

Select a paragraph.

Step 2

Prompt: “Update the selected text to ‘Welcome to Our Platform!’ and center-align it.”

Change

Behavior

Step 1

Select a link.

Step 2

Prompt: “Wrap the selected element in a tooltip that says ‘Click here to learn more.’”

---

Tips & Best Practices

• One element at a time: activate Select to Edit for each distinct change.

• Chaining edits: after one change, re-activate and select another element to continue refining.

• Undo & History: if you mis-select, cancel the prompt, or revert via the Version History panel found in the "Publish" drop-down.

---

Harness “Select to Edit” to make pixel-perfect tweaks in seconds—no CSS selectors required!

---