Make it yours
You'll learn the golden rule of customization: make every request clear, say exactly what to change, where it is, and what it should look like afterwards. Screenshots help enormously.
The golden rule: be clear and as specific as you can
You can ask for several changes in one message, the agent handles that fine, as long as each change is unmistakably clear. What breaks iteration is vagueness, not volume.
Compare:
- ❌ "Make the design better"
- ✅ "Three changes: (1) move the Sign In button to the top-right corner and make it blue, (2) change the page background to light blue, (3) make the product title text bigger."
The agent updates the preview automatically after each round. You'll see the result in seconds, and you can immediately ask for the next round - or undo what you just tried.
Do's and don'ts of prompting
Do:
- Name the element and its location: "the card at the top of the page", "the text under the photo", "the menu icon on the left side".
- Say what the end state should be, not just what's wrong: "move it to the top-right" beats "it's in the wrong place".
- Upload a screenshot when words aren't enough, drag the image into chat and add a short note like "this spacing looks too tight" or "the text is cut off here".
- Paste the full error message when something breaks (right-click → Copy in your browser console), with a one-line prompt like "please solve this error".
- Bundle related changes in one clear, numbered message.
Don't:
- Send vague requests like "improve it" or "the button looks wrong", the agent has to guess.
- Paste API keys or other secrets into chat, they belong in your project's secrets, never in messages (see Keep it safe).
- Mix a bug report and a redesign in one breath without separating them, number them so each gets addressed.
Edit visually with Canvas edit
In the preview pane, there is a Canvas edit option available for making visual tweaks directly on the page. You can click the Edit button in the canvas and select a particular design element, a chat window will appear and you can describe your changes there regarding that particular element, and the agent makes the changes in chat.
Keep iterating or start fresh
Every change builds on the last one. If a tweak didn't land the way you hoped, just ask again:
- "Actually, move that button back to the left"
- "Make the text a bit smaller - that's too big"
- "Go back to the original color"
You can cycle through options as many times as you need. The preview updates each time, so you'll know immediately when something clicks.
If you've gone down a rabbit hole and want to reset, describe your original vision again in a fresh message. The agent will re-approach the design from scratch. Or you can roll back to a previous state.
If something looks wrong
For layout problems - text cut off, buttons hidden, spacing gone wrong - a screenshot often works better than words. The agent will inspect the component and adjust the styles.
The preview and your live app are completely separate. Changes you see in the preview do not automatically appear in production. Until you Re-publish, your live app keeps running the last version you published - even if the preview shows something totally different.
Go deeper: Previewing & iterating
