# Select to edit

***

{% embed url="<https://vimeo.com/1097293557?share=copy#t=0>" %}

### How It Works

{% stepper %}
{% step %}

#### **Activate Select to Edit**

Click the 🎯 “Select to Edit” icon in the prompt box toolbar.
{% endstep %}

{% step %}

#### **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.
{% endstep %}

{% step %}

#### **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.
{% endstep %}

{% step %}

#### **Run & Apply**

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

***

### Examples

<table data-card-size="large" data-view="cards"><thead><tr><th>Change</th><th>Step 1</th><th>Step 2</th><th data-hidden data-card-cover data-type="files"></th></tr></thead><tbody><tr><td><strong>Styling</strong></td><td>Select a button.</td><td>Prompt: “Make the selected element’s text uppercase”</td><td><a href="/files/XDDC2qzF0URfV9RVW1zN">/files/XDDC2qzF0URfV9RVW1zN</a></td></tr><tr><td><strong>Content</strong></td><td>Select a paragraph.</td><td>Prompt: “Update the selected text to ‘Welcome to Our Platform!’ and center-align it.”</td><td><a href="/files/ygWj7ul2yL4rCMoF9sHH">/files/ygWj7ul2yL4rCMoF9sHH</a></td></tr><tr><td><strong>Behavior</strong></td><td>Select a link.</td><td>Prompt: “Wrap the selected element in a tooltip that says ‘Click here to learn more.’”</td><td><a href="/files/t6BXjpUhnqEKn4PfgXlk">/files/t6BXjpUhnqEKn4PfgXlk</a></td></tr></tbody></table>

***

### 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!

***


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.maker.co/features/select-to-edit.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.