Chatting with the agent

The chat is where you work with the agent. You write what you want in your own words, the agent changes your app in its environment, and the preview updates while it writes the code. Each finished reply creates a new version of your project, which you can always view or restore.

Send a request

1. Click the input at the bottom of the panel (Ask for a change…).

2. Describe the change as concretely as you can:

   Add a "Pricing" section below the testimonials, with three plans: Starter €15, Monthly €59, Yearly €590. Highlight the monthly plan.

3. Press Enter (or click the Send arrow). To add a new line without sending: Shift + Enter.

The button next to +, Building, shows the message mode: in Building mode, the agent changes your app directly. The other mode, Discussion, is for asking questions or requesting a plan without changing anything (see Discussion mode). Alt + P switches between them.

Tip

A precise request gets a better result than a vague one: say what you want to see, where, and with what content. Detailed advice is in Writing good requests.

Follow the agent’s work

As soon as you send, a Highwind reply appears with the Waiting… badge, then Working. At the very start, “Preparing the environment…” shows while your project’s environment starts up. Then the agent writes what it’s doing and its actions show up live, grouped in cards.

What each step means

What you see	What the agent is doing
A file marked written, edited or deleted	It creates, edits or deletes that file. ×3 means it came back to it three times. A spinner shows while the action runs, a green check once it succeeded.
Read / Read N files	It reads existing files to understand the code before changing it.
Some text in quotes (“Header”)	It searches the code for that text.
Package names (react-router…)	It installs these dependencies.
Browsing files	It looks at the list of project files.
Checking the project	It runs the check (types, build and preview).
Reading the database schema / Database: …	It reads or changes your app’s database (if the backend is enabled).
Adds a server to the app	It gives your app a server for its /api routes. See The app server.
Asks for the key …	It needs an API key: a card shows up in the chat (see below).
Reads the server logs	It checks the logs to understand an error in an /api route.
Creates the image …	It generates an image for your site. See Generated images.
Offers you a choice	It asks you how to store data (see below).
Asks you a few questions	It sends you a form. See The agent’s questions.
N actions failed	One or more actions didn’t work. The agent sees it and usually fixes it on its own.

At the end, a line sums up the check: Checked: typecheck, build and preview OK (all good), Checked: typecheck and build OK, or Some errors remain to be fixed.

After the reply

Below each finished reply you’ll find:

• Show steps: replays the list of actions, with a summary (“4 files written or edited · 6 read”). Click a file to see exactly what changed in it.
• Show changes: opens the Changes tab on the version created by this reply.
• The version badge (v7) to the right of the Highwind name: click it to show that version in the preview (read-only), click again to go back to the current version.
• The credits used by this reply, with a small coin (for example “0.6 credits”). See Credits.

Stop the agent

While the agent is working, the send button turns into a square: Stop the agent. Click it to interrupt.

• Files already changed are kept in a version (“Run cancelled midway”), which you can keep, fix, or undo by restoring the previous version.
• The work already done is charged; if the agent hadn’t changed any file yet, nothing is charged.

Note

One run at a time: while the agent works on a project, you can’t send it another message, nor start the agent on another of your projects.

Suggestions and feedback

Suggestions

Below the latest reply, the agent suggests two or three next steps tailored to your app (“Add a contact form with validation”, “Make the header sticky on scroll”…). Click a suggestion to send it as is, in Building mode.

Give feedback

The thumbs below each reply tell whether it was useful: Good response or Could be better. With thumbs down, a field asks “What went wrong? (optional)”: write what didn’t work and click Send, or Skip. Click a thumb again to remove your rating. This feedback helps the team improve the agent.

Attach images

You can attach up to 4 images per message (PNG, JPEG, WebP or GIF). There are two ways to do it, with different effects:

Reference image

A screenshot, a mockup, a site that inspires you: the agent looks at it, but it isn’t added to the site.

• + menu → Attach → Reference image,
• or paste a screenshot straight into the input (Ctrl + V),
• or drop the image onto the input (“Drop your images here”).

Redo the hero section like in this screenshot, but with our colors.

Image for the site

Your logo, your photos: the image is saved in the project (public/assets/ folder) and the agent places it in the site.

• + menu → Attach → Upload an image to the project (from your computer),
• or Use a project image to pick an image already in the library,
• or, in the Images tab, an image’s Use in the chat button.

These images have a turquoise outline and a small folder icon, in the input as well as in the history.

Put this logo in the header, on the left, and in the footer.

Hover an attached image and click the cross (Remove image) to take it off before sending.

Caution

Images are resized in your browser before they’re sent. An image that’s still too heavy after resizing (over 5 MB) is refused with “Unreadable or too large image”. SVG images can’t be attached to the chat: the agent can’t look at them. Mention their URL in your message instead (“use /assets/logo.svg in the header”).

The + menu

The + button to the left of the input gathers everything you can add to your message. A search box at the top of the menu filters the entries.

Entry	What it does
Attach	A reference image, an image to upload to the project, or an image already in the project (see above).
Connectors	The services the agent can wire into your app (payments, email, AI, CRM…). Those already set up are marked Connected. Picking a service inserts it into your message.
Select an element	You click an element in the preview so your request targets it. See Select an element.
Edit directly	Opens Design mode on the Element tab so you can edit an element yourself, for free. See Design mode.
Manage connectors	Opens your account’s Connectors page in a new tab (your keys and accounts, reused across all your projects).

Select an element and Edit directly are greyed out when they aren’t possible, with the reason on hover: “The preview isn’t ready yet”, “Not available on an old version” or “Wait for the agent to finish”.

Mention a connector with @

Type @ in the input: the menu opens straight on the Connectors list. Pick a service and it’s inserted as a chip in your message. If you close the menu without picking, the “@” character is simply typed.

Add card payments with @Stripe on the Booking page.

Mentioning a connector tells the agent you want that service: it wires it into your app and asks you for the key if it needs one. Context sources (Notion, Linear, Figma, Kameleoon) are mentioned the same way, so the agent reads your page, ticket or design. See Connectors and Context sources.

The agent’s cards in the chat

Sometimes the agent needs you to continue. It then ends its reply and shows a card below the chat.

“Your call”: where to store data

When your app needs to keep data (sign-ups, orders, accounts…) and several solutions are possible, the agent offers you a choice. The card states the need (“Save the sign-ups to your waitlist”) and offers two or three options, its recommendation first with the Recommended badge:

• Database: user accounts, data shared across devices and files, hosted by Highwind in Europe. Clicking it creates the database (“Creating the database… (under a minute)”), then the agent resumes on its own.
• In a Google Sheets spreadsheet: each entry is added as a row in a spreadsheet in your Google Drive, no database needed.
• By email (Resend): you get each entry by email.
• In Slack: each entry is posted to a Slack channel.
• Later: data stays in each visitor’s browser for now.

Click the option that suits you: Highwind does what’s needed and the agent carries on with your choice. To understand the differences, read Where to store data.

“The agent needs a key”

When a feature of your app needs an API key (to send emails, take a payment…), a card asks for it:

• for a connector (“The agent needs your Resend connection”): pick a connection already saved in your account (Use a connection from your account), or paste a new key. It’s encrypted and saved in your account, reusable in your other projects. Highwind checks the key and tells you whether it works;
• for another key (“The agent needs a key”, with its name, for example CONTACT_EMAIL): paste the value and click Add. It’s encrypted and never shown to the agent.

Dismiss removes the request. You can always add the key later in Project settings → Secrets. See Secrets.

Other cards

• The agent’s questions: a short form when a few answers really change the result (brand name, colors, prices…). See The agent’s questions.
• Connect your Google account: when your app saves to Google Sheets, connect your account so the spreadsheet gets created. See Google Sheets.

When sending is blocked

Message	What to do
“Save or discard your code changes before sending a message.”	You changed code in the Code tab without saving it. Click Save or Discard in that tab, then send your message again. (In Discussion mode, sending still works: nothing gets changed.)
“You’re out of credits for today: more arrive at …”	Your credits for the day are used up. Meanwhile, you can keep editing your app for free in Design mode. See Credits.
The input says “The agent is working…”	Wait for the current reply to finish, or stop the agent.

See also

Writing good requestsRequests that get a good result the first time.

Discussion modeAsk questions and get a plan without changing anything.

Select an elementTarget a specific element of the preview.

How the agent worksWhat happens during a run.